yudao-dev/src/views/base/coreCustomer/add-or-updata.vue

<!--
 * @Author: zwq
 * @Date: 2021-11-18 14:16:25
 * @LastEditors: DY
 * @LastEditTime: 2023-12-12 16:04:44
 * @Description:
-->
<template>
	<el-form
		:model="dataForm"
		:rules="dataRule"
		ref="dataForm"
		@keyup.enter.native="dataFormSubmit()"
		label-width="80px">
		<el-row :gutter="20">
			<el-col :span="12">
				<el-form-item label="客户编号" prop="code">
					<el-input v-model="dataForm.code" :disabled="isdetail" clearable placeholder="请输入客户编号" />
				</el-form-item>
			</el-col>
			<el-col :span="12">
				<el-form-item label="客户名称" prop="name">
					<el-input v-model="dataForm.name" :disabled="isdetail" clearable placeholder="请输入客户名称" />
				</el-form-item>
			</el-col>
		</el-row>
		<el-row :gutter="20">
			<el-col :span="12">
				<el-form-item label="联系人" prop="contact">
					<el-input v-model="dataForm.contact" :disabled="isdetail" clearable placeholder="请输入联系人" />
				</el-form-item>
			</el-col>
			<el-col :span="12">
				<el-form-item label="联系电话" prop="telephone">
					<el-input
						v-model="dataForm.telephone"
						:disabled="isdetail"
						maxlength="11"
						placeholder="请输入联系电话" />
				</el-form-item>
			</el-col>
		</el-row>
		<el-form-item label="地址" prop="address">
			<el-input
				v-model="dataForm.address"
				:disabled="isdetail"
				placeholder="请输入地址" />
		</el-form-item>
		<el-form-item label="备注" prop="remark">
			<el-input
				v-model="dataForm.remark"
				:disabled="isdetail"
				placeholder="请输入备注" />
		</el-form-item>
		<el-form-item label="特殊要求" prop="specialRequirements">
			<el-input
				type="textarea"
				v-model="dataForm.specialRequirements"
				:disabled="isdetail"
				placeholder="请输入备注" />
				<imageUpload v-model="files" :disabled="isdetail" :limit="5"/>
		</el-form-item>
	</el-form>
</template>

<script>
import basicAdd from '../../core/mixins/basic-add';
import { createCustomer, updateCustomer, getCustomer, getCode } from "@/api/base/coreCustomer";
import ImageUpload from '@/components/ImageUpload';

export default {
	mixins: [basicAdd],
	components: { ImageUpload },
	data() {
		return {
			urlOptions: {
			  isGetCode: true,
        codeURL: getCode,
				createURL: createCustomer,
				updateURL: updateCustomer,
				infoURL: getCustomer
			},
			files: [],
			isdetail: false,
			dataForm: {
        id: undefined,
        code: undefined,
        name: undefined,
        telephone: undefined,
				contact: undefined,
				address: undefined,
        remark: undefined,
				specialRequirements: undefined,
				files: []
			},
			dataRule: {
        code: [{ required: true, message: "客户编号不能为空", trigger: "blur" }],
        name: [{ required: true, message: "客户名称不能为空", trigger: "blur" }],
				contact: [{ required: true, message: "联系人不能为空", trigger: "blur" }],
				telephone: [
					{ required: false, trigger: "blur", message: "手机号不能为空" },
          {
            validator: function (rule, value, callback) {
              if (value) {
								if (/^(?:(?:\+|00)86)?1(?:3[\d]|4[5-79]|5[0-35-9]|6[5-7]|7[0-8]|8[\d]|9[189])\d{8}$/.test(value) === false) {
									callback(new Error("手机号格式错误"));
								} else {
									callback();
								}
							} else {
								callback();
							}
            }, trigger: "blur"
          }
        ]
      }
		};
	},
	mounted() {},
	methods: {
		init(id, isdetail) {
      this.dataForm.id = id || "";
			this.isdetail = isdetail || false;
      this.visible = true;
      if (this.urlOptions.getOption) {
        this.getArr()
      }
      this.$nextTick(() => {
        this.$refs["dataForm"].resetFields();
        if (this.dataForm.id) {
          this.urlOptions.infoURL(id).then(response => {
            this.dataForm = response.data;
            if (this.setData) {
              this.setDataForm()
            }
          });
        } else {
          if (this.urlOptions.isGetCode) {
            this.getCode()
          }
				}
      });
    },
		// 表单提交
    dataFormSubmit() {
			console.log('122', this.files)
      this.$refs["dataForm"].validate((valid) => {
        if (!valid) {
          return false;
        }

				this.dataForm.files = []
				if (this.files.length > 0) {
					this.files.forEach(item => {
						const temp = {
							fileType: 1,
							fileUrl: item
						}
						this.dataForm.files.push(temp)
					})
				}

        // 修改的提交
        if (this.dataForm.id) {
          this.urlOptions.updateURL(this.dataForm).then(response => {
            this.$modal.msgSuccess("修改成功");
            this.visible = false; 
            this.$emit("refreshDataList");
          });
          return;
        }
        // 添加的提交
        this.urlOptions.createURL(this.dataForm).then(response => {
          this.$modal.msgSuccess("新增成功");
          this.visible = false;
          this.$emit("refreshDataList");
        });
      });
    },
	}
};
</script>