平台端店铺增删改查功能模块业务开发完善

src/views/business/shopList/index.vue

@@ -180,7 +180,7 @@
               : '查看店铺'
         "
         :visible.sync="dialogVisible"
-        width="30%"
+        width="40%"
         center
         :close-on-click-modal="false"
       >
@@ -200,6 +200,26 @@
                     :disabled="disabled"
                   />
                 </el-form-item>
+        <el-form-item label="店铺Logo" prop="shopLogo">
+          <el-upload
+            :class="[{ 'avatar-uploader': !ruleForm.shopLogo }]"
+            :headers="headers"
+            :data="dataObj"
+            :action="action"
+            :show-file-list="false"
+            :on-success="handleLogoSuccess"
+            :disabled="disabled"
+          >
+            <img
+              v-if="ruleForm.shopLogo"
+              :src="ruleForm.shopLogo"
+              class="avatar"
+              width="80"
+              height="80"
+            >
+            <i v-else class="el-icon-plus avatar-uploader-icon"/>
+          </el-upload>
+        </el-form-item>
                 <el-form-item
                   label="店铺编码"
                   prop="shopCode"
@@ -282,6 +302,79 @@
                     <el-input :value="hidden(ruleForm.shopAdress, 1, 1)" :disabled="disabled" />
                   </div> -->
                 </el-form-item>
+        <el-form-item
+          label="退货联系人"
+          prop="shopReturn.returnPerson"
+        >
+          <el-input
+            v-model="ruleForm.shopReturn.returnPerson"
+            maxlength="20"
+            :disabled="disabled"
+          />
+        </el-form-item>
+        <el-form-item
+          label="退货联系电话"
+          prop="shopReturn.returnPhone"
+        >
+          <el-input
+            v-if="returnPhoneShow"
+            :value="hidden(ruleForm.shopReturn.returnPhone,3,4)"
+            maxlength="11"
+            :disabled="disabled"
+            @focus="focusReturnPhoneInput"
+          />
+          <el-input
+            v-else
+            ref="returnPhoneCls"
+            v-model="ruleForm.shopReturn.returnPhone"
+            maxlength="11"
+            clearable
+            :disabled="disabled"
+          />
+        </el-form-item>
+        <el-form-item
+          label="退货地址"
+          prop="shopReturn.returnAdress"
+        >
+          <el-input
+            ref="addressCls"
+            v-model="ruleForm.shopReturn.returnAdress"
+            maxlength="60"
+            :disabled="disabled"
+          />
+        </el-form-item>
+        <el-form-item label="店铺类型">
+          <el-radio-group v-model="ruleForm.shopType" @change="onShopTypeChange" :disabled="disabled">
+            <el-radio :label="1">国内贸易</el-radio>
+            <el-radio :label="2">跨境保税</el-radio>
+            <el-radio :label="3">海外直邮</el-radio>
+          </el-radio-group>
+        </el-form-item>
+
+        <el-form-item
+          label="电商企业名称"
+          prop="crossDetail.ebpname"
+          v-if="localIsCross"
+        >
+          <el-input
+            v-model="ruleForm.crossDetail.ebpname"
+            maxlength="20"
+            :disabled="disabled"
+          />
+        </el-form-item>
+
+        <el-form-item
+          label="电商企业代码"
+          prop="crossDetail.ebpcode"
+          v-if="localIsCross"
+        >
+          <el-input
+            v-model="ruleForm.crossDetail.ebpcode"
+            maxlength="20"
+            :disabled="disabled"
+          />
+        </el-form-item>
+
                 <!-- <el-form-item
                   label="生效日期"
                   prop="effectiveDate"
@@ -391,6 +484,8 @@ import {
 import {
   businessListGetAll
 } from '@/api/business'
+import {uploadUrl} from "@/utils/request";
+import {getToken} from "@/utils/auth";
 export default {
   data () {
     // 这里存放数据
@@ -408,13 +503,25 @@ export default {
       },
       businessList:{},
       disabled: false,
+      localIsCross :false,
       ruleForm: {
         shopName: '', // 店铺名称
+        shopLogo: '', //店铺logo
         chargePersonName: '', // 店铺负责人
         chargePersonPhone: '', // 负责人电话
         shopAdress: '', // 地址
+        shopType: 1, // 店铺类型
         businessId : null,
-        businessName : ""
+        businessName : "",
+        shopReturn:{
+          returnAdress:"",
+          returnPerson:"",
+          returnPhone:""
+        },
+        crossDetail :{
+          ebpname:"",
+          ebpcode:""
+        }
       },
       showPhone: false,
       showAddress: false,
@@ -427,6 +534,9 @@ export default {
         shopName: [
           { required: true, message: '请输入店铺名称', trigger: 'blur' }
         ],
+        shopLogo: [
+          { required: true, message: '请上传店铺Logo', trigger: 'blur' }
+        ],
         chargePersonName: [
           { required: true, message: '请输入店铺负责人', trigger: 'blur' }
         ],
@@ -440,6 +550,19 @@ export default {
         shopAdress: [
           { required: true, message: '请输入地址', trigger: 'blur' }
         ],
+        "shopReturn.returnPerson": [
+          { required: true, message: '请输入退货联系人', trigger: 'blur' }
+        ],
+        "shopReturn.returnPhone": [
+          { required: true, message: '请输入退货联系人电话', trigger: 'blur' },
+          {
+            pattern: /^1[3456789]\d{9}$/,
+            message: '目前只支持中国大陆的手机号码'
+          }
+        ],
+        "shopReturn.returnAdress": [
+          { required: true, message: '请输入退货地址', trigger: 'blur' }
+        ],
         businessId: [
           {
             required: true,
@@ -454,7 +577,15 @@ export default {
       userState: 1,
       privacyTime: 0,
       cpPhoneShow: true, // 是否显示脱敏负责人手机号
-      shopPhoneShow: true // 是否显示脱敏账号
+      returnPhoneShow: true, // 是否显示脱敏负责人手机号
+      shopPhoneShow: true, // 是否显示脱敏账号
+      headers: {
+        'Authorization-business': getToken(),
+      },
+      dataObj: {
+        folderId: 1,
+      },
+      action: uploadUrl,
     }
   },
   // 监听属性 类似于data概念
@@ -481,6 +612,16 @@ export default {
       const res = await businessListGetAll(params)
       this.businessList = res.data.list
     },
+
+    focusReturnPhoneInput(){
+      this.returnPhoneShow = false
+      this.ruleForm.shopReturn.returnPhone = ''
+      // 自动获取焦点
+      this.$nextTick(() => {
+        this.$refs.returnPhoneCls.focus()
+      })
+    },
+
     focusShopPhoneInput () {
       this.shopPhoneShow = false
       this.ruleForm.shopPhone = ''
@@ -516,6 +657,7 @@ export default {
     // 新建店铺
     addbuss () {
       this.userState = 0
+      this.localIsCross = false
       this.disabled = false
       this.newAddress = ''
       this.personPhone = ''
@@ -525,6 +667,17 @@ export default {
         chargePersonName: '', // 店铺负责人
         chargePersonPhone: '', // 负责人电话
         shopAdress: '', // 地址
+        isCross: 0,
+        shopType: 1, // 店铺类型
+        shopReturn:{
+          returnAdress:"",
+          returnPerson:"",
+          returnPhone:""
+        },
+        crossDetail :{
+          ebpname:"",
+          ebpcode:""
+        },
        businessId:null,
        businessName:''
       }
@@ -579,7 +732,7 @@ export default {
               }
               this.getAll(this.formInline)
               this.dialogVisible = false
-              this.$refs.ruleForm.clearValidate()
+              this.$refs['ruleFormInfo'].clearValidate()
             })
           } else {
             shopListUpdate(this.ruleForm).then(res => {
@@ -589,7 +742,7 @@ export default {
                   message: '修改成功',
                   type: 'success'
                 })
-                this.$refs.ruleForm.clearValidate()
+                this.$refs['ruleFormInfo'].clearValidate()
               }
               this.getAll(this.formInline)
               this.dialogVisible = false
@@ -612,6 +765,7 @@ export default {
         this.userState = 3
         this.disabled = true
         this.ruleForm = res.data
+        this.localIsCross = this.ruleForm.shopType === 2
         this.selectBusinessList(this.ruleForm.businessName)
         this.dialogVisible = true
       }
@@ -625,9 +779,9 @@ export default {
       this.cpPhoneShow = true
       const res = await shopListGetById({ shopId: row.shopId })
       this.ruleForm = res.data
+      this.localIsCross = this.ruleForm.shopType === 2
       this.selectBusinessList(this.ruleForm.businessName)
       this.dialogVisible = true
-      console.log(this.ruleForm)
     },
     // 删除
     async del (row) {
@@ -726,6 +880,16 @@ export default {
       return (
         str.substring(0, frontLen) + xing + str.substring(str.length - endLenData)
       )
+    },
+
+    handleLogoSuccess(response) {
+      const { url } = response.data;
+      this.ruleForm.shopLogo = url;
+    },
+
+    onShopTypeChange(e) {
+      this.localIsCross = e === 2
+      this.ruleForm.isCross = e === 2 ? 1 : 0;
     }
   }
 }