feat:销售模块更换地址选择组件

src/components/addr-add-edit-modal/index.vue

@@ -255,6 +255,8 @@ export default {
             id
           } = this.sitem
 
+          console.log(this.sitem)
+
           this.ruleForm = {
             receipt_quantity,
             contactor,

src/components/in-address-model/index.vue

@@ -11,12 +11,12 @@
     element-loading-text="拼命加载中"
     element-loading-spinner="el-icon-loading"
     element-loading-background="rgba(0, 0, 0, 0.8)"
-    @close="showModelThis = false"
     append-to-body
+    @close="showModelThis = false"
   >
     <el-card style="margin-top: -25px">
       <upload-excel :on-success="handleSuccess" :before-upload="beforeUpload" />
-      <el-form :model="ruleForm" ref="ruleForm" :size="'mini'">
+      <el-form ref="ruleForm" :model="ruleForm" :size="'mini'">
         <el-table
           :data="ruleForm.order_addr"
           border
@@ -62,24 +62,24 @@
           <el-table-column fixed="right" width="80" label="操作">
             <template slot-scope="scope">
               <el-tooltip effect="dark" content="编辑" placement="top">
-                <i class="el-icon-edit tb-icon" @click="openHouseModal(scope.$index)"></i>
+                <i class="el-icon-edit tb-icon" @click="openHouseModal(scope.$index)" />
               </el-tooltip>
               <el-tooltip effect="dark" content="删除" placement="top">
                 <i
                   class="el-icon-delete tb-icon"
                   @click="deleteRow(scope.$index, ruleForm.order_addr)"
-                ></i>
+                />
               </el-tooltip>
             </template>
           </el-table-column>
         </el-table>
       </el-form>
       <addr-add-edit-modal
-        :showModel="showAddrAddEditModal"
+        :show-model="showAddrAddEditModal"
         :index="AddrAddEditModalIndex"
         :sitem="AddrAddEditModalSitem"
-        @cancel="showAddrAddEditModal = false"
         :type="'1'"
+        @cancel="showAddrAddEditModal = false"
         @refresh="showAddrAddEditModalRefresh"
       />
       <div class="tr" style="padding: 10px 0 0 0">
@@ -89,8 +89,8 @@
   </el-dialog>
 </template>
 <script>
-import resToken from "@/mixins/resToken";
-import { province_list, city_list, county_list } from "@/assets/js/area-data";
+import resToken from '@/mixins/resToken'
+import { province_list, city_list, county_list } from '@/assets/js/area-data'
 import {
   isnumber,
   isMobile,
@@ -98,166 +98,166 @@ import {
   isEmoticon,
   isSpecialSymbol,
   hasSpace,
-  isAddr,
-} from "@/utils/validate";
-import AddrAddEditModal from "@/components/addr-add-edit-modal";
+  isAddr
+} from '@/utils/validate'
+import AddrAddEditModal from '@/components/addr-add-edit-modal'
 export default {
-  name: "inAddrModel",
-  props: ["showModel", "id", "sitem"],
-  mixins: [resToken],
+  name: 'InAddrModel',
   components: { AddrAddEditModal },
+  mixins: [resToken],
+  props: ['showModel', 'id', 'sitem'],
   data() {
     const validatemobile = (rule, value, callback) => {
-      if (value === "") {
-        callback(new Error("联系电话不能为空！"));
+      if (value === '') {
+        callback(new Error('联系电话不能为空！'))
       } else {
         if (!isMobile(value)) {
-          callback(new Error("联系电话格式不正确！"));
+          callback(new Error('联系电话格式不正确！'))
         } else {
-          callback();
+          callback()
         }
       }
-    };
+    }
     const validateWeight = (rule, value, callback) => {
-      if (value === "") {
-        callback(new Error("收货总数不能为空!"));
+      if (value === '') {
+        callback(new Error('收货总数不能为空!'))
       } else {
         if (!isnumber(value)) {
-          callback(new Error("收货总数仅支持整数!"));
+          callback(new Error('收货总数仅支持整数!'))
         } else {
-          callback();
+          callback()
         }
       }
-    };
+    }
     const validatecontactor = (rule, value, callback) => {
-      if (value === "") {
-        callback(new Error("联系人不能为空！"));
+      if (value === '') {
+        callback(new Error('联系人不能为空！'))
       } else {
         if (value.length < 2 || value.length > 10) {
-          callback(new Error("联系人规则为2~10位汉字！"));
+          callback(new Error('联系人规则为2~10位汉字！'))
         } else {
           if (!isChinese(value)) {
-            callback(new Error("联系人规则为2~10位汉字！"));
+            callback(new Error('联系人规则为2~10位汉字！'))
           } else if (isEmoticon(value)) {
-            callback(new Error("联系人规则为2~10位汉字！"));
+            callback(new Error('联系人规则为2~10位汉字！'))
           } else {
-            callback();
+            callback()
           }
         }
       }
-    };
+    }
     const validateAddr = (rule, value, callback) => {
-      if (value === "") {
-        callback(new Error("详细地址不能为空！"));
+      if (value === '') {
+        callback(new Error('详细地址不能为空！'))
       } else {
         if (hasSpace(value)) {
-          callback(new Error("不能出现回车/换行符！"));
+          callback(new Error('不能出现回车/换行符！'))
         } else if (isSpecialSymbol(value)) {
-          callback(new Error("不能使用英文特殊字符！"));
+          callback(new Error('不能使用英文特殊字符！'))
         } else if (isAddr(value)) {
-          callback();
+          callback()
         } else {
-          callback(new Error("详细地址填写不规范！"));
+          callback(new Error('详细地址填写不规范！'))
         }
       }
-    };
+    }
     return {
       showAddrAddEditModal: false,
       AddrAddEditModalIndex: -1,
       AddrAddEditModalSitem: {},
       tableData: [],
       tableHeader: [],
-      title: "",
+      title: '',
       showModelThis: false,
       loading: false,
       newTime: 0,
       pickerOptions: {
         disabledDate: (time) => {
-          return time.getTime() < new Date().valueOf();
-        },
+          return time.getTime() < new Date().valueOf()
+        }
       },
       rulesThis: this.rules,
       ruleForm: {
-        order_addr: [], //收货地址
+        order_addr: [] // 收货地址
       },
       rules: {
         receipt_quantity: [
           {
             required: true,
             validator: validateWeight,
-            trigger: "blur",
-          },
+            trigger: 'blur'
+          }
         ],
 
         contactor: [
           {
             required: true,
-            trigger: "blur",
-            validator: validatecontactor,
-          },
+            trigger: 'blur',
+            validator: validatecontactor
+          }
         ],
         mobile: [
           {
             required: true,
             validator: validatemobile,
-            trigger: "blur",
-          },
+            trigger: 'blur'
+          }
         ],
         addr_code: [
           {
-            type: "array",
+            type: 'array',
             required: false,
-            trigger: "change",
-          },
+            trigger: 'change'
+          }
         ],
         addr: [
           {
             required: true,
             validator: validateAddr,
-            trigger: "blur",
-          },
-        ],
-      },
-    };
+            trigger: 'blur'
+          }
+        ]
+      }
+    }
   },
   watch: {
-    showModel: function (val) {
-      this.showModelThis = val;
+    showModel: function(val) {
+      this.showModelThis = val
       if (val) {
-        this.initForm();
+        this.initForm()
       }
     },
     showModelThis(val) {
       if (!val) {
-        this.$emit("cancel");
+        this.$emit('cancel')
       }
-    },
+    }
   },
   mounted() {
-    this.get_code();
+    this.get_code()
   },
   methods: {
     async resetForm() {
       // 重置
       await this.$nextTick(() => {
         if (this.$refs.ruleForm) {
-          this.$refs.ruleForm.resetFields();
-          this.$refs.ruleForm.clearValidate();
+          this.$refs.ruleForm.resetFields()
+          this.$refs.ruleForm.clearValidate()
           this.ruleForm = {
-            order_addr: [],
-          };
+            order_addr: []
+          }
         }
-      });
+      })
     },
     // 省市区删除行操作
     deleteRow(index, rows) {
-      rows.splice(index, 1);
+      rows.splice(index, 1)
     },
     showAddrAddEditModalRefresh(e) {
-      const { index, item } = e;
+      const { index, item } = e
 
       if (index === -1) {
-        this.ruleForm.order_addr.push(JSON.parse(JSON.stringify(item)));
+        this.ruleForm.order_addr.push(JSON.parse(JSON.stringify(item)))
       } else {
         const {
           receipt_quantity,
@@ -267,96 +267,102 @@ export default {
           addr_code_name,
           addr,
           id,
-        } = JSON.parse(JSON.stringify(item));
-        this.ruleForm.order_addr[index].receipt_quantity = receipt_quantity;
-        this.ruleForm.order_addr[index].contactor = contactor;
-        this.ruleForm.order_addr[index].mobile = mobile;
-        this.ruleForm.order_addr[index].addr_code = addr_code;
-        this.ruleForm.order_addr[index].addr_code_name = addr_code_name;
-        this.ruleForm.order_addr[index].addr = addr;
-        this.ruleForm.order_addr[index].id = id;
+          areaCode,
+          areaLabel
+        } = JSON.parse(JSON.stringify(item))
+        this.ruleForm.order_addr[index].receipt_quantity = receipt_quantity
+        this.ruleForm.order_addr[index].contactor = contactor
+        this.ruleForm.order_addr[index].mobile = mobile
+        this.ruleForm.order_addr[index].addr_code = addr_code
+        this.ruleForm.order_addr[index].addr_code_name = addr_code_name
+        this.ruleForm.order_addr[index].addr = addr
+        this.ruleForm.order_addr[index].id = id
+        this.ruleForm.order_addr[index].areaCode = areaCode
+        this.ruleForm.order_addr[index].areaLabel = areaLabel
       }
-      this.$refs.ruleForm.validateField("order_addr");
+      this.$refs.ruleForm.validateField('order_addr')
     },
     beforeUpload(file) {
-      const isLt1M = file.size / 1024 < 500;
+      const isLt1M = file.size / 1024 < 500
       if (isLt1M) {
-        return true;
+        return true
       }
       this.$message({
-        message: "请不要上传大于500KB的文件.",
-        type: "warning",
-      });
-      return false;
+        message: '请不要上传大于500KB的文件.',
+        type: 'warning'
+      })
+      return false
     },
     handleSuccess({ results, header }) {
       if (results.length === 0) {
-        this.$message.error("表格无有效数据！");
-        return;
+        this.$message.error('表格无有效数据！')
+        return
       }
       if (results.length > 500) {
-        this.$message.error("地址数据不能超过500条！");
-        return;
+        this.$message.error('地址数据不能超过500条！')
+        return
       }
-      let head = [
-        "收货总数",
-        "收货联系人",
-        "收货联系电话",
-        "收货省名称",
-        "收货市名称",
-        "收货区名称",
-        "详细地址",
-      ];
+      const head = [
+        '收货总数',
+        '收货联系人',
+        '收货联系电话',
+        '收货省名称',
+        '收货市名称',
+        '收货区名称',
+        '详细地址'
+      ]
       if (head.length !== header.length) {
-        this.$message.error("表头与导入模板不匹配！");
-        return;
+        this.$message.error('表头与导入模板不匹配！')
+        return
       }
-      let hederOk = true;
+      let hederOk = true
       head.forEach((v1, i1) => {
-        if (v1 !== header[i1].replace(/\s*/g, "")) {
-          hederOk = false;
+        if (v1 !== header[i1].replace(/\s*/g, '')) {
+          hederOk = false
         }
-      });
+      })
 
       if (!hederOk) {
-        this.$message.error("表头与导入模板不匹配！");
-        return;
+        this.$message.error('表头与导入模板不匹配！')
+        return
       }
-      this.tableHeader = header;
-      this.tableData = [];
-      let list = results;
-      let tableOk = true;
-      this.ruleForm.order_addr = [];
+      this.tableHeader = header
+      this.tableData = []
+      const list = results
+      const tableOk = true
+      this.ruleForm.order_addr = []
       list.forEach((v1) => {
-        let b = Object.values(v1);
-        let item = this.get_code(b[3], b[4], b[5]);
-        let model = {
-          receipt_quantity: b[0] + "",
-          contactor: b[1] + "",
-          mobile: b[2] + "",
-          in_addr: b[3] + "/" + b[4] + "/" + b[5],
-          addr_code_name: item.name + "",
+        const b = Object.values(v1)
+        const item = this.get_code(b[3], b[4], b[5])
+        const model = {
+          receipt_quantity: b[0] + '',
+          contactor: b[1] + '',
+          mobile: b[2] + '',
+          in_addr: b[3] + '/' + b[4] + '/' + b[5],
+          areaCode: item.code[item.code.length - 1],
+          addr_code_name: item.name + '',
           addr_code: item.code,
-          addr: b[6] + "",
-          edit: false,
-        };
-        this.ruleForm.order_addr.push(model);
-      });
+          label: b[3] + b[4] + b[5],
+          addr: b[6] + '',
+          edit: false
+        }
+        this.ruleForm.order_addr.push(model)
+      })
       if (!tableOk) {
-        this.$message.error("最晚收货日期不正确，请将表格格式转为文本上传！");
+        this.$message.error('最晚收货日期不正确，请将表格格式转为文本上传！')
       }
     },
     openHouseModal(index) {
-      this.AddrAddEditModalIndex = index;
+      this.AddrAddEditModalIndex = index
 
       if (index === -1) {
-        this.AddrAddEditModalSitem = {};
+        this.AddrAddEditModalSitem = {}
       } else {
         this.AddrAddEditModalSitem = JSON.parse(
           JSON.stringify(this.ruleForm.order_addr[index])
-        );
+        )
       }
-      this.showAddrAddEditModal = true;
+      this.showAddrAddEditModal = true
       // let findex = this.ruleForm.order_addr.findIndex((v) => v.edit === true);
       // if (findex !== -1) {
       //   this.$message.warning("当前已有地址在编辑，请保存后再试！");
@@ -366,181 +372,181 @@ export default {
       // }
     },
     unique(arr) {
-      let hash = [];
+      const hash = []
       for (let i = 0; i < arr.length; i++) {
-        let index = hash.findIndex((v1) => v1.inv_number === arr[i].inv_number);
+        const index = hash.findIndex((v1) => v1.inv_number === arr[i].inv_number)
         if (index === -1) {
-          hash.push(arr[i]);
+          hash.push(arr[i])
         }
       }
-      return hash;
+      return hash
     },
     setTime(time) {
-      time = time.replace(/\//g, "-");
-      time = time.replace(/\./g, "-");
-      let key = new Date(time).valueOf() + "";
+      time = time.replace(/\//g, '-')
+      time = time.replace(/\./g, '-')
+      const key = new Date(time).valueOf() + ''
       if (key.length !== 13) {
-        time = "";
+        time = ''
       }
-      return time;
+      return time
     },
     async initForm() {
-      this.rulesThis = this.rules;
-      await this.resetForm();
-      this.newTime = 0;
-      this.loading = true;
-      this.tableData = [];
-      this.tableHeader = [];
-      this.step = 1;
-      this.title = "批量导入收货地址信息";
+      this.rulesThis = this.rules
+      await this.resetForm()
+      this.newTime = 0
+      this.loading = true
+      this.tableData = []
+      this.tableHeader = []
+      this.step = 1
+      this.title = '批量导入收货地址信息'
 
-      this.changea();
-      this.loading = false;
+      this.changea()
+      this.loading = false
     },
     refreshAll() {
-      this.showModelThis = false;
-      this.$emit("refresh");
+      this.showModelThis = false
+      this.$emit('refresh')
     },
     changea() {
-      this.newTime = new Date().valueOf();
+      this.newTime = new Date().valueOf()
     },
 
     async submitForm() {
       if (!this.loading) {
-        this.loading = true;
-        const { order_addr } = this.ruleForm;
+        this.loading = true
+        const { order_addr } = this.ruleForm
         if (order_addr.length < 1) {
-          this.$message.error("导入数据不能为空！");
-          this.loading = false;
-          return;
+          this.$message.error('导入数据不能为空！')
+          this.loading = false
+          return
         }
-        let isEdit = false;
+        let isEdit = false
         order_addr.forEach((v) => {
-          v.err = false;
+          v.err = false
           if (v.edit) {
-            v.err = true;
-            isEdit = true;
+            v.err = true
+            isEdit = true
           }
-        });
+        })
         if (isEdit) {
-          this.$message.error("当前收货地址已在编辑，请保存后再试！");
-          this.loading = false;
-          return;
+          this.$message.error('当前收货地址已在编辑，请保存后再试！')
+          this.loading = false
+          return
         }
-        let cItem = null;
+        let cItem = null
         order_addr.some((x, i) => {
-          cItem = this.checkItem(x);
+          cItem = this.checkItem(x)
           if (!cItem.isok) {
-            cItem.index = i;
-            return true;
+            cItem.index = i
+            return true
           }
-        });
+        })
         if (cItem && !cItem.isok) {
-          this.$message.error(`第${cItem.index + 1}行,${cItem.message}`);
-          this.loading = false;
-          return;
+          this.$message.error(`第${cItem.index + 1}行,${cItem.message}`)
+          this.loading = false
+          return
         }
-        let list = JSON.parse(JSON.stringify(order_addr));
-        this.$emit("refresh", { list: list });
+        const list = JSON.parse(JSON.stringify(order_addr))
+        this.$emit('refresh', { list: list })
       }
     },
     checkItem(sitem) {
-      let model = {
+      const model = {
         isok: true,
-        message: "",
-      };
-      const { arrive_time, receipt_quantity, contactor, mobile, addr_code, addr } = sitem;
-      if (receipt_quantity === "" && model.isok) {
-        model.isok = false;
-        model.message = "收货总数不能为空!";
+        message: ''
+      }
+      const { arrive_time, receipt_quantity, contactor, mobile, addr_code, addr } = sitem
+      if (receipt_quantity === '' && model.isok) {
+        model.isok = false
+        model.message = '收货总数不能为空!'
       }
       if (!isnumber(receipt_quantity) && model.isok) {
-        model.isok = false;
-        model.message = "收货总数仅支持整数!";
+        model.isok = false
+        model.message = '收货总数仅支持整数!'
       }
-      if (arrive_time === "" && model.isok) {
-        model.isok = false;
-        model.message = "最晚收货日期不能为空!";
+      if (arrive_time === '' && model.isok) {
+        model.isok = false
+        model.message = '最晚收货日期不能为空!'
       }
 
-      if (contactor === "" && model.isok) {
-        model.isok = false;
-        model.message = "收货联系人不能为空!";
+      if (contactor === '' && model.isok) {
+        model.isok = false
+        model.message = '收货联系人不能为空!'
       }
-      if (mobile === "" && model.isok) {
-        model.isok = false;
-        model.message = "收货联系电话不能为空!";
+      if (mobile === '' && model.isok) {
+        model.isok = false
+        model.message = '收货联系电话不能为空!'
       }
       if (!isMobile(mobile) && model.isok) {
-        model.isok = false;
-        model.message = "收货联系电话格式不正确!";
+        model.isok = false
+        model.message = '收货联系电话格式不正确!'
       }
       // if (addr_code.length !== 3 && model.isok) {
       //   model.isok = false;
       //   model.message = "收货省市区不能为空!";
       // }
-      if (addr === "" && model.isok) {
-        model.isok = false;
-        model.message = "详细地址不能为空!";
+      if (addr === '' && model.isok) {
+        model.isok = false
+        model.message = '详细地址不能为空!'
       }
-      return model;
+      return model
     },
     get_code(name1, name2, name3) {
-      let name = "",
-        code = [];
+      let name = ''
+      let code = []
       if (name1 && name2 && name3) {
-        for (let x in province_list) {
+        for (const x in province_list) {
           if (name1 === province_list[x]) {
-            code.push(x);
-            name += province_list[x];
-            break;
+            code.push(x)
+            name += province_list[x]
+            break
           }
         }
         if (code.length === 1) {
-          for (let y in city_list) {
+          for (const y in city_list) {
             if (name2 === city_list[y]) {
-              code.push(y);
-              name += "/" + city_list[y];
-              break;
+              code.push(y)
+              name += '/' + city_list[y]
+              break
             }
           }
         }
         if (code.length === 2) {
-          for (let z in county_list) {
+          for (const z in county_list) {
             if (name3 === county_list[z]) {
-              code.push(z);
-              name += "/" + county_list[z];
-              break;
+              code.push(z)
+              name += '/' + county_list[z]
+              break
             }
           }
         }
 
         if (code.length === 3) {
-          let str1 = "",
-            str2 = "",
-            isok = false;
-          str1 = code[0].slice(0, 2);
-          str2 = code[1].slice(2, 4);
+          let str1 = ''
+          let str2 = ''
+          let isok = false
+          str1 = code[0].slice(0, 2)
+          str2 = code[1].slice(2, 4)
           if (
             code[1].indexOf(str1) === 0 &&
             code[2].indexOf(str1) === 0 &&
             code[2].indexOf(str2) == 2
           ) {
-            isok = true;
+            isok = true
           }
           if (!isok) {
-            name = "";
-            code = [];
+            name = ''
+            code = []
           }
         } else {
-          name = "";
-          code = [];
+          name = ''
+          code = []
         }
       }
-      return { name: name, code: code };
-    },
-  },
-};
+      return { name: name, code: code }
+    }
+  }
+}
 </script>
 
 <style lang="scss" scoped>

src/views/sellOut/project/components/buyGoodModal.vue

@@ -236,11 +236,15 @@
                     :size="'mini'"
                     :style="{ marginBottom: scope.row.edit ? '13px' : '0' }"
                   >
-                    <select-area
-                      :value="scope.row.addr_code"
+                    <search-area
+                      :value="scope.row.code"
+                      :is-detail="scope.row.edit"
                       :disabled="!scope.row.edit"
-                      :size="'mini'"
-                      @selectChange="select_area_change($event, scope.$index)"
+                      size="mini"
+                      :names="scope.row.label"
+                      placeholder="收货省市区"
+                      :level="3"
+                      @searchChange="areaChange($event,scope.$index)"
                     />
                   </el-form-item>
                   <span v-if="!scope.row.edit">{{ scope.row.addr_code_name }}</span>
@@ -510,7 +514,7 @@ export default {
     showModel: function(val) {
       this.showModelThis = val
       if (val) {
-        this.initForm()
+        // this.initForm()
       }
     },
     showModelThis(val) {
@@ -524,7 +528,6 @@ export default {
       console.log('closeModel!!')
       this.showModelThis = false
     },
-
     async initForm() {
       this.loading = true
       this.project_list = []
@@ -551,7 +554,11 @@ export default {
       this.loading = false
     },
     addrRefresh(e) {
-      const { list } = e
+      const list = JSON.parse(JSON.stringify(e.list))
+      list.forEach(item => {
+        item.label = [item.label]
+        item.code = [item.areaCode]
+      })
       this.addrForm.order_addr.push(...list)
     },
     async prev_goods() {
@@ -634,13 +641,26 @@ export default {
             contactor: '',
             mobile: '',
             addr_code: [],
-            addr: ''
+            addr: '',
+            code: [],
+            label: []
           })
         } else {
           this.addrForm.order_addr[index].edit = true
         }
       }
     },
+    async areaChange(e, index) {
+      const { code, area_code, label, splitLabel } = e
+      // this.addrForm.order_addr[index] = e
+      this.addrForm.order_addr[index].addr_code_name = splitLabel ? splitLabel.split(',').join('/') : ''
+      this.addrForm.order_addr[index].addr_code = code ? code.split(',') : []
+      this.addrForm.order_addr[index].code = area_code ? [area_code] : []
+      this.addrForm.order_addr[index].label = label ? [label] : []
+
+      console.log(this.addrForm.order_addr)
+      // this.$refs.ruleForm.validateField('addr_code')
+    },
     // 省市区选择
     async select_area_change(e, index) {
       this.addrForm.order_addr[index].addr_code = e

src/views/sellOut/salesOrder/components/addForm.vue

@@ -476,14 +476,6 @@
                   :size="'mini'"
                   :style="{ marginBottom: scope.row.edit ? '13px' : '0' }"
                 >
-                  <!-- <select-area
-                    :value="scope.row.addr_code"
-                    placeholder="收货省市区"
-                    :disabled="!scope.row.edit"
-                    :size="'mini'"
-                    @selectChange="select_area_change($event, scope.$index)"
-                  /> -->
-
                   <search-area 
                     :value="scope.row.code"
                     size="mini" 

src/views/sellOut/salesOrder/components/out-order-add-model.vue

@@ -69,13 +69,6 @@
                   prop="addr_code"
                   :label-width="'99px'"
                 >
-                  <!-- <select-area
-                    :value="ruleForm.addr_code"
-                    :size="'mini'"
-                    placeholder="收货省市区"
-                    @selectChange="select_area_change($event)"
-                  /> -->
-
                   <search-area
                     :value="code"
                     :is-detail="true"

src/views/sellOut/sellAfterApply/components/supplier-confirm.vue

@@ -17,12 +17,14 @@
         <el-input v-model="formData.mobile" :maxlength="11" />
       </el-form-item>
       <el-form-item label="退货地址" prop="addr_code">
-        <select-area
-          :placeholder="'省/市/区'"
-          :value="formData.addr_code"
+        <search-area
+          :value="code"
           :is-detail="true"
-          :size="'mini'"
-          @selectChange="addr_selectChange"
+          size="mini"
+          :names="label"
+          placeholder="收货省市区"
+          :level="3"
+          @searchChange="areaChange($event)"
         />
       </el-form-item>
 
@@ -82,6 +84,8 @@ export default {
   props: ['sitem'],
   data() {
     return {
+      code: [],
+      label: [],
       formData: {
         status: '4',
         remark: '',
@@ -154,6 +158,13 @@ export default {
       this.formData.addr_code = e || []
       this.$refs.formRef.validateField('addr_code')
     },
+    async areaChange(e) {
+      const { code, area_code, label } = e
+      this.formData.addr_code = code ? code.split(',') : []
+      this.code = area_code ? [area_code] : []
+      this.label = label ? [label] : []
+      this.$refs.formRef.validateField('addr_code')
+    },
     submit() {
       this.$refs.formRef.validate(isValid => {
         if (!isValid) return

src/views/sellOut/sellAfterApply/components/supplier_exam.vue

@@ -17,12 +17,14 @@
         <el-input v-model="formData.mobile" :maxlength="11" />
       </el-form-item>
       <el-form-item label="退货地址" prop="addr_code">
-        <select-area
-          :placeholder="'省/市/区'"
-          :value="formData.addr_code"
+        <search-area
+          :value="code"
           :is-detail="true"
-          :size="'mini'"
-          @selectChange="addr_selectChange"
+          size="mini"
+          :names="label"
+          placeholder="收货省市区"
+          :level="3"
+          @searchChange="areaChange($event)"
         />
       </el-form-item>
 
@@ -83,6 +85,8 @@ export default {
   props: ['sitem'],
   data() {
     return {
+      code: [],
+      label: [],
       formData: {
         status: '4',
         remark: '',
@@ -158,6 +162,13 @@ export default {
       this.formData.addr_code = e || []
       this.$refs.formRef.validateField('addr_code')
     },
+    async areaChange(e) {
+      const { code, area_code, label } = e
+      this.formData.addr_code = code ? code.split(',') : []
+      this.code = area_code ? [area_code] : []
+      this.label = label ? [label] : []
+      this.$refs.formRef.validateField('addr_code')
+    },
     submit() {
       this.$refs.formRef.validate(isValid => {
         if (!isValid) return