车辆计算内容

package.json

@@ -49,6 +49,7 @@
     "clipboard": "2.0.8",
     "core-js": "^3.26.0",
     "crypto-js": "^4.0.0",
+    "dayjs": "^1.11.12",
     "echarts": "5.4.0",
     "element-ui": "2.15.12",
     "file-saver": "2.0.5",

src/api/base/carmain/index.js

@@ -59,6 +59,14 @@ export function getCarMainPage(params) {
     params
   })
 }
+// 获得车辆信息分页
+export function compute(data) {
+  return request({
+    url: '/base/carMain/compute',
+    method: 'post',
+    data: data
+  })
+}
 // 导出车辆信息 Excel
 export function exportCarMainExcel(params) {
   return request({

src/views/base/carbrand/CarBrandForm.vue

@@ -3,33 +3,65 @@
     <!-- 对话框(添加 / 修改) -->
     <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="45%" v-dialogDrag append-to-body>
       <el-form ref="formRef" :model="formData" :rules="formRules" v-loading="formLoading" label-width="100px">
-        <el-form-item label="品牌名称" prop="brandName">
+
-          <el-input v-model="formData.brandName" placeholder="请输入品牌名称" />
+        <el-row :gutter="2">
-        </el-form-item>
+          <el-col :span="10">
-        <!-- <el-form-item label="状态" prop="status">
+            <el-form-item label="品牌名称" prop="brandName">
-                      <el-radio-group v-model="formData.status">
+              <el-input v-model="formData.brandName" placeholder="请输入品牌名称" />
-                            <el-radio label="1">请选择字典生成</el-radio>
+            </el-form-item>
-                      </el-radio-group>
+          </el-col>
-                    </el-form-item> -->
+          <el-col :span="10">
-        <el-form-item label="备注" prop="remark">
+            <el-form-item label="英文名称" prop="englishName">
-          <el-input v-model="formData.remark" placeholder="请输入备注" />
+              <el-input v-model="formData.englishName" placeholder="请输入品牌英文名称" />
-        </el-form-item>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="2">
+          <el-col :span="10">
+            <el-form-item label="品牌缩写" prop="abbName">
+              <el-input v-model="formData.abbName" placeholder="请输入品牌缩写" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item label="品牌类型 " prop="brandType">
+              <el-select v-model="formData.brandType" placeholder="请选择品牌类型 ">
+                <el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_BRAND_TYPE)" :key="dict.value" :label="dict.label"
+                           :value="dict.value" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="2">
+          <el-col :span="10">
+            <el-form-item label="保养里程" prop="ruleMileage">
+              <el-input v-model="formData.ruleMileage" placeholder="请输入保养里程">
+                <template slot="suffix">km</template>
+              </el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item label="保养时间" prop="ruleTime">
+              <el-input v-model="formData.ruleTime" placeholder="请输入保养时间">
+                <template slot="suffix">月</template>
+              </el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="2">
+          <el-col :span="20">
+            <el-form-item label="备注" prop="remark">
+              <el-input type="textarea" v-model="formData.remark" placeholder="请输入备注" />
+            </el-form-item>
+          </el-col>
+        </el-row>
         <el-form-item label="车标图片">
           <ImageUpload v-model="formData.logoImg" :limit="1"/>
         </el-form-item>
-        <el-form-item label="品牌英文名称" prop="englishName">
-          <el-input v-model="formData.englishName" placeholder="请输入品牌英文名称" />
-        </el-form-item>
-        <el-form-item label="品牌缩写" prop="abbName">
-          <el-input v-model="formData.abbName" placeholder="请输入品牌缩写" />
-        </el-form-item>
-        <el-form-item label="品牌类型 " prop="brandType">
-          <el-select v-model="formData.brandType" placeholder="请选择品牌类型 ">
-            <el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_BRAND_TYPE)" :key="dict.value" :label="dict.label"
-              :value="dict.value" />
-          </el-select>
-        </el-form-item>
       </el-form>
+
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="submitForm" :disabled="formLoading">确 定</el-button>
         <el-button @click="dialogVisible = false">取 消</el-button>
@@ -62,6 +94,8 @@ export default {
         remark: undefined,
         logoImg: undefined,
         englishName: undefined,
+        ruleMileage: undefined,
+        ruleTime: undefined,
         abbName: undefined,
         brandType: undefined,
       },
@@ -69,7 +103,9 @@ export default {
       formRules: {
         brandName: [{ required: true, message: '品牌名称不能为空', trigger: 'blur' }],
         // status: [{ required: true, message: '状态不能为空', trigger: 'blur' }],
-        brandType: [{ required: true, message: '品牌类型 不能为空', trigger: 'change' }],
+        brandType: [{ required: true, message: '品牌类型不能为空', trigger: 'change' }],
+        ruleMileage: [{ required: true, message: '保养里程不能为空', trigger: 'change' }],
+        ruleTime: [{ required: true, message: '保养时间不能为空', trigger: 'change' }],
       },
     };
   },

src/views/base/carbrand/CarModelForm.vue

@@ -1,20 +1,56 @@
 <template>
   <div class="app-container">
     <!-- 对话框(添加 / 修改) -->
-    <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="45%" v-dialogDrag append-to-body>
+    <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="50%" v-dialogDrag append-to-body>
       <el-form ref="formRef" :model="formData" :rules="formRules" v-loading="formLoading" label-width="100px">
-        <el-form-item label="型号名称" prop="modelName">
+        <el-row :gutter="2">
-          <el-input v-model="formData.modelName" placeholder="请输入型号名称" />
+          <el-col :span="10">
-        </el-form-item>
+            <el-form-item label="型号名称" prop="modelName">
-        <el-form-item label="排序" prop="sort">
+              <el-input v-model="formData.modelName" placeholder="请输入型号名称" />
-          <el-input-number v-model="formData.sort" controls-position="right" :min="0" />
+            </el-form-item>
-        </el-form-item>
+          </el-col>
-        <el-form-item label="型号缩写" prop="abbName">
+          <el-col :span="10">
-          <el-input v-model="formData.abbName" placeholder="请输入型号缩写" />
+            <el-form-item label="型号缩写" prop="abbName">
-        </el-form-item>
+              <el-input v-model="formData.abbName" placeholder="请输入型号缩写" />
-        <el-form-item label="备注" prop="remark">
+            </el-form-item>
-          <el-input v-model="formData.remark" placeholder="请输入备注" />
+          </el-col>
-        </el-form-item>
+        </el-row>
+
+        <el-row :gutter="2">
+          <el-col :span="10">
+            <el-form-item label="保养里程" prop="ruleMileage">
+              <el-input v-model="formData.ruleMileage" placeholder="请输入保养里程">
+                <template slot="suffix">km</template>
+              </el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item label="保养时间" prop="ruleTime">
+              <el-input v-model="formData.ruleTime" placeholder="请输入保养时间">
+                <template slot="suffix">月</template>
+              </el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="2">
+          <el-col :span="10">
+            <el-form-item label="排序" prop="sort">
+              <el-input-number v-model="formData.sort" controls-position="right" :min="0" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item label="备注" prop="remark">
+              <el-input v-model="formData.remark" placeholder="请输入备注" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+
+
+
+
+
 
       </el-form>
       <div slot="footer" class="dialog-footer">
@@ -52,6 +88,8 @@ export default {
         id: undefined,
         sort: 0,
         modelName: undefined,
+        ruleMileage: undefined,
+        ruleTime: undefined,
         remark: undefined,
         abbName: undefined,
       },
@@ -59,6 +97,8 @@ export default {
       formRules: {
         sort: [{ required: true, message: '排序不能为空', trigger: 'blur' }],
         modelName: [{ required: true, message: '型号名称不能为空', trigger: 'blur' }],
+        ruleMileage: [{ required: true, message: '保养里程不能为空', trigger: 'blur' }],
+        ruleTime: [{ required: true, message: '保养时间不能为空', trigger: 'blur' }],
       },
     };
   },

src/views/base/carmain/CarMainForm.vue

@@ -1,126 +1,157 @@
 <template>
   <div class="app-container">
     <!-- 对话框(添加 / 修改) -->
-    <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="60%" v-dialogDrag append-to-body>
+    <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="70%" v-dialogDrag append-to-body>
       <el-form ref="formRef" :model="formData" :rules="formRules" v-loading="formLoading" label-width="100px">
-        <el-row :gutter="2">
+        <el-collapse v-model="activeNames">
-          <el-col :span="11">
+          <el-collapse-item title="车辆基本信息" name="1">
-            <el-form-item label="发动机号码" prop="engineNumber">
+            <el-row :gutter="20">
-              <el-input v-model="formData.engineNumber" placeholder="请输入发动机号码" />
+              <el-col :span="8">
-            </el-form-item>
+                <el-form-item label="车牌号" prop="licenseNumber">
-          </el-col>
+                  <el-input v-model="formData.licenseNumber" placeholder="请输入车牌号"/>
-          <el-col :span="11">
+                </el-form-item>
-            <el-form-item label="车架号" prop="vin">
+              </el-col>
-              <el-input v-model="formData.vin" placeholder="请输入车架号" />
+              <el-col :span="8">
-            </el-form-item>
+                <el-form-item label="发动机号码" prop="engineNumber">
-          </el-col>
+                  <el-input v-model="formData.engineNumber" placeholder="请输入发动机号码"/>
-        </el-row>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="车架号" prop="vin">
+                  <el-input v-model="formData.vin" placeholder="请输入车架号"/>
+                </el-form-item>
+              </el-col>
+
+            </el-row>
 
 
-        <el-row :gutter="2">
+            <el-row :gutter="20">
-          <el-col :span="11">
+              <el-col :span="8">
-            <el-form-item label="车牌号" prop="licenseNumber">
+                <el-form-item label="品牌型号" prop="brandAndModel">
-              <el-input v-model="formData.licenseNumber" placeholder="请输入车牌号" />
+                  <CarBrandSelector v-model="formData.brandAndModel" ref="brandForm"/>
-            </el-form-item>
+                </el-form-item>
-          </el-col>
+              </el-col>
-          <el-col :span="11">
+              <el-col :span="8">
-            <el-form-item label="品牌型号" prop="brandAndModel">
+                <el-form-item label="车辆类别" prop="carCategory">
-              <CarBrandSelector v-model="formData.brandAndModel" ref="brandForm" />
+                  <el-select v-model="formData.carCategory" placeholder="请选择车辆类别">
-            </el-form-item>
+                    <el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CAR_CATEGORY)" :key="dict.value"
-          </el-col>
+                               :label="dict.label" :value="dict.value"/>
-        </el-row>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="车辆性质" prop="carNature">
+                  <el-select v-model="formData.carNature" placeholder="请选择车辆性质">
+                    <el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CAR_NATURE)" :key="dict.value"
+                               :label="dict.label" :value="dict.value"/>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="20">
+              <el-col :span="8">
+                <el-form-item label="注册日期" prop="carRegisterDate" label-width="auto">
+                  <el-date-picker clearable v-model="formData.carRegisterDate" type="date" value-format="timestamp"
+                                  placeholder="选择车辆注册日期"/>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-collapse-item>
+          <!--    车辆业务信息      -->
+          <el-collapse-item title="车辆业务信息" name="2">
+            <el-row :gutter="20">
+              <el-col :span="8">
+                <el-form-item label="最近办理业务" prop="recentlyHandledBusiness">
+                  <el-select v-model="formData.recentlyHandledBusiness" placeholder="请选择业务类别" clearable>
+                    <el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CUS_BUSI_TYPE)" :key="dict.value"
+                               :label="dict.label" :value="dict.value"/>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="最近业务时间" prop="recentlyHandleBusinessTime">
+                  <el-date-picker clearable v-model="formData.recentlyHandleBusinessTime" type="date"
+                                  value-format="timestamp" placeholder="选择最近办理业务的时间"/>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="二级维护时间" prop="checkDate">
+                  <el-date-picker clearable v-model="formData.checkDate" type="date" value-format="timestamp"
+                                  placeholder="选择二级维护时间"/>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="20">
+              <el-col :span="8">
+                <el-form-item label="保养日期" prop="maintenanceDate">
+                  <el-date-picker clearable v-model="formData.maintenanceDate" type="date" value-format="timestamp"
+                                  placeholder="选择保养日期"/>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="年检日期" prop="inspectionDate">
+                  <el-date-picker clearable v-model="formData.inspectionDate" type="date" value-format="timestamp"
+                                  placeholder="选择年检日期"/>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="保险日期" prop="insuranceDate">
+                  <el-date-picker clearable v-model="formData.insuranceDate" type="date" value-format="timestamp"
+                                  placeholder="选择保险日期"/>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="20">
+              <el-col :span="8">
+                <el-form-item label="保养里程" prop="maintenanceMileage">
+                  <el-input v-model="formData.maintenanceMileage" placeholder="请输入保养里程"/>
+                </el-form-item>
+              </el-col>
+              <el-col :span="16">
+                <el-button :loading="buttonLoading" icon="el-icon-date" @click="compute" size="small" type="primary">计算</el-button>
+              </el-col>
+            </el-row>
+          </el-collapse-item>
 
-        <el-row :gutter="2">
+          <el-collapse-item title="测算信息" name="3">
-          <el-col :span="11">
+            <el-row :gutter="20">
-            <el-form-item label="保养日期" prop="maintenanceDate">
+              <el-col :span="8">
-              <el-date-picker clearable v-model="formData.maintenanceDate" type="date" value-format="timestamp"
+                <el-form-item label="保险到期时间" prop="insuranceExpiryDate">
-                placeholder="选择保养日期" />
+                  <el-date-picker clearable v-model="formData.insuranceExpiryDate" type="date" value-format="timestamp"
+                                  placeholder="选择下次保险时间"/>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="下次年检时间" prop="nextInspectionDate">
+                  <el-date-picker clearable v-model="formData.nextInspectionDate" type="date" value-format="timestamp"
+                                  placeholder="选择下次年检时间"/>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="下次保养时间" prop="nextMaintenanceDate">
+                  <el-date-picker clearable v-model="formData.nextMaintenanceDate" type="date" value-format="timestamp"
+                                  placeholder="选择下次保养时间"/>
+                </el-form-item>
+              </el-col>
+              <el-col :span="8">
+                <el-form-item label="下次保养里程" prop="nextMaintenanceMileage">
+                  <el-input v-model="formData.nextMaintenanceMileage" placeholder="请输入下次保养里程"/>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-collapse-item>
+          <el-collapse-item title="附件信息" name="4">
+            <el-form-item>
+              <ImageUpload v-model="formData.carLicenseImg"/>
             </el-form-item>
-          </el-col>
+          </el-collapse-item>
-          <el-col :span="11">
-            <el-form-item label="保养里程" prop="maintenanceMileage">
-              <el-input v-model="formData.maintenanceMileage" placeholder="请输入保养里程" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row :gutter="2">
-          <el-col :span="11">
-            <el-form-item label="年检日期" prop="inspectionDate">
-              <el-date-picker clearable v-model="formData.inspectionDate" type="date" value-format="timestamp"
-                placeholder="选择年检日期" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="11">
-            <el-form-item label="保险日期" prop="insuranceDate">
-              <el-date-picker clearable v-model="formData.insuranceDate" type="date" value-format="timestamp"
-                placeholder="选择保险日期" />
-            </el-form-item>
-          </el-col>
-        </el-row>
 
-        <el-row :gutter="2">
+        </el-collapse>
-          <el-col :span="11">
-            <el-form-item label="车辆注册日期" prop="carRegisterDate" label-width="auto">
-              <el-date-picker clearable v-model="formData.carRegisterDate" type="date" value-format="timestamp"
-                placeholder="选择车辆注册日期" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="11">
-            <el-form-item label="二级维护时间" prop="checkDate">
-              <el-date-picker clearable v-model="formData.checkDate" type="date" value-format="timestamp"
-                placeholder="选择二级维护时间" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="2">
-          <el-col :span="11">
-            <el-form-item label="车辆类别" prop="carCategory">
-              <el-select v-model="formData.carCategory" placeholder="请选择车辆类别">
-                <el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CAR_CATEGORY)" :key="dict.value"
-                  :label="dict.label" :value="dict.value" />
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="11">
-            <el-form-item label="车辆性质" prop="carNature">
-              <el-select v-model="formData.carNature" placeholder="请选择车辆性质">
-                <el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CAR_NATURE)" :key="dict.value"
-                  :label="dict.label" :value="dict.value" />
-              </el-select>
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="2">
-          <el-col :span="11">
-            <el-form-item label="最近办理业务" prop="recentlyHandledBusiness">
-              <el-select v-model="formData.recentlyHandledBusiness" placeholder="请选择业务类别" clearable>
-                <el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CUS_BUSI_TYPE)" :key="dict.value"
-                  :label="dict.label" :value="dict.value" />
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="11">
-            <el-form-item label="最近业务时间" prop="recentlyHandleBusinessTime" >
-              <el-date-picker clearable v-model="formData.recentlyHandleBusinessTime" type="date"
-                value-format="timestamp" placeholder="选择最近办理业务的时间" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row :gutter="1">
-          <el-col :span="22">
-            <el-form-item label="行驶证图片">
-              <ImageUpload v-model="formData.carLicenseImg" :limit="1" />
-            </el-form-item>
-          </el-col>
-        </el-row>
       </el-form>
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="submitForm" :disabled="formLoading">确 定</el-button>
         <el-button @click="dialogVisible = false">取 消</el-button>
       </div>
-
     </el-dialog>
   </div>
 </template>
@@ -128,18 +159,19 @@
 <script>
 import * as CarMainApi from '@/api/base/carmain';
 import ImageUpload from '@/components/ImageUpload';
-import { getDictDatas, DICT_TYPE } from '@/utils/dict';
+import {getDictDatas, DICT_TYPE} from '@/utils/dict';
 import CarBrandSelector from '@/layout/components/CarBrandSelector';
+
 export default {
   name: "CarMainForm",
   components: {
     ImageUpload,
     CarBrandSelector,
-
   },
   data() {
     return {
-      tesst: ["5d8eb726839bbe64a4f405e0cce29274", "7c8493517c4eaa0f0c56f40f0626e8d2"],
+      //折叠面板默认展开
+      activeNames: ['1', '2', '3', '4'],
       // 弹出层标题
       dialogTitle: "",
       // 是否显示弹出层
@@ -162,21 +194,44 @@ export default {
         carNature: undefined,
         carRegisterDate: undefined,
         carLicenseImg: undefined,
+        carCategory: undefined,
+        insuranceExpiryDate: undefined,
+        nextInspectionDate: undefined,
+        nextMaintenanceDate: undefined,
+        nextMaintenanceMileage: undefined,
       },
+      buttonLoading:false,
       // 表单校验
       formRules: {
-        engineNumber: [{ required: true, message: '发动机号码不能为空', trigger: 'blur' }],
+        engineNumber: [{required: true, message: '发动机号码不能为空', trigger: 'blur'}],
-        vin: [{ required: true, message: '车架号不能为空', trigger: 'blur' }],
+        vin: [{required: true, message: '车架号不能为空', trigger: 'blur'}],
-        licenseNumber: [{ required: true, message: '车牌号不能为空', trigger: 'blur' }],
+        licenseNumber: [{required: true, message: '车牌号不能为空', trigger: 'blur'}],
-        inspectionDate: [{ required: true, message: '年检日期不能为空', trigger: 'blur' }],
+        carCategory: [{required: true, message: '车辆类别不能为空', trigger: 'blur'}],
-        carBrand: [{ required: true, message: '车辆品牌不能为空', trigger: 'blur' }],
+        carNature: [{required: true, message: '车辆性质不能为空', trigger: 'blur'}],
-        carNature: [{ required: true, message: '车辆性质不能为空', trigger: 'blur' }],
+        carRegisterDate: [{required: true, message: '车辆注册日期不能为空', trigger: 'blur'}],
-        carRegisterDate: [{ required: true, message: '车辆注册日期不能为空', trigger: 'blur' }],
+        brandAndModel: [{required: true, message: '品牌型号不能为空', trigger: 'blur'}],
-        brandAndModel: [{ required: true, message: '品牌型号不能为空', trigger: 'blur' }],
       },
     };
   },
   methods: {
+    /**计算车辆信息*/
+    async compute(){
+      this.buttonLoading = true
+      try{
+        const data = this.formData;
+        console.log(data,'adadadad')
+        debugger
+        const res = await CarMainApi.compute(data);
+        const result = res.data;
+        this.formData.insuranceExpiryDate = result.insuranceExpiryDate
+        this.formData.nextInspectionDate = result.nextInspectionDate
+        this.formData.nextMaintenanceDate = result.nextMaintenanceDate
+        this.formData.nextMaintenanceMileage = result.nextMaintenanceMileage
+      } finally {
+        this.buttonLoading = false
+      }
+    },
+
     /** 打开弹窗 */
     async open(id) {
       this.dialogVisible = true;

src/views/base/customer/CustomerMainForm.vue

@@ -7,13 +7,13 @@
         <el-collapse v-model="activeNames">
           <!--客户基本信息面板-->
           <el-collapse-item title="客户基本信息" name="1">
-            <el-row :gutter="2">
+            <el-row :gutter="20">
-              <el-col :span="11">
+              <el-col :span="12">
                 <el-form-item label="客户名称" prop="cusName">
                   <el-input v-model="formData.cusName" placeholder="请输入客户名称" />
                 </el-form-item>
               </el-col>
-              <el-col :span="11">
+              <el-col :span="12">
                 <el-form-item label="客户类型" prop="typeCode">
                   <el-select v-model="formData.typeCode" placeholder="请选择客户类型">
                     <el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CUS_TYPE)" :key="dict.value"
@@ -22,13 +22,13 @@
                 </el-form-item>
               </el-col>
             </el-row>
-            <el-row :gutter="2">
+            <el-row :gutter="20">
-              <el-col :span="11">
+              <el-col :span="12">
                 <el-form-item v-if="formData.typeCode !== '03'" label="身份证号" prop="idCard">
                   <el-input v-model="formData.idCard" placeholder="请输入客户身份证号" />
                 </el-form-item>
               </el-col>
-              <el-col :span="11">
+              <el-col :span="12">
                 <el-form-item v-if="formData.typeCode !== '03'" label="性别" prop="sex">
                   <el-radio-group v-model="formData.sex">
                     <el-radio v-for="dict in sexDictDatas" :key="dict.value" :label="dict.value">
@@ -38,21 +38,21 @@
                 </el-form-item>
               </el-col>
             </el-row>
-            <el-row :gutter="2">
+            <el-row :gutter="20">
-              <el-col :span="11">
+              <el-col :span="12">
                 <el-form-item v-if="formData.typeCode !== '03'" label="生日" prop="birthday">
                   <el-date-picker v-model="formData.birthday" type="date" placeholder="选择日期">
                   </el-date-picker>
                 </el-form-item>
               </el-col>
-              <el-col :span="11">
+              <el-col :span="12">
                 <el-form-item label="联系方式" prop="phoneNumber">
                   <el-input v-model="formData.phoneNumber" placeholder="请输入客户联系方式" />
                 </el-form-item>
               </el-col>
             </el-row>
             <el-row :gutter="2">
-              <el-col :span="11">
+              <el-col :span="12">
                 <el-form-item label="客户来源" prop="dataFrom">
                   <el-select v-model="formData.dataFrom" placeholder="请选择客户来源">
                     <el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CUS_DATA_FROM)" :key="dict.value"
@@ -60,7 +60,7 @@
                   </el-select>
                 </el-form-item>
               </el-col>
-              <el-col :span="11">
+              <el-col :span="12">
                 <el-form-item label="注册方式" prop="inviterType">
                   <el-select v-model="formData.inviterType" placeholder="请选择注册方式">
                     <el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_SIGN_TYPE)" :key="dict.value"
@@ -70,7 +70,7 @@
               </el-col>
             </el-row>
             <el-row>
-              <el-col :span="22">
+              <el-col :span="24">
                 <el-form-item label="联系地址" prop="address">
                   <el-input type="textarea" v-model="formData.address" placeholder="请输入客户联系地址" />
                 </el-form-item>