收货地址编辑完毕

1

src/views/teamDetail/api.js

@@ -95,7 +95,7 @@ export const getConvertDeatil = data => request2({
   method: 'get'
 })
 
-
+// 获取乐团收货地址
 export const getMusicGroupAddr = data => request2({
   url: '/api-web/musicGroupShippingAddress/queryPage',
   data,
@@ -104,4 +104,27 @@ export const getMusicGroupAddr = data => request2({
   requestType: 'form'
 })
 
+// 新增收货地址
+export const addMusicGroupAddr = data => request2({
+  url: '/api-web/musicGroupShippingAddress/add',
+  data,
+  method: 'post',
+
+})
+// 修改收货地址
+export const resetMusicGroupAddr = data => request2({
+  url: '/api-web/musicGroupShippingAddress/update',
+  data,
+  method: 'post',
+
+})
+
+// 删除收货地址
+export const deleteMusicGroupAddr = data => request2({
+  url: '/api-web/musicGroupShippingAddress/delete',
+  data,
+  params: data,
+  method: 'get',
+  requestType: 'form'
+})
 // courseScheduleConvert/queryCourse

src/views/teamDetail/teamListComponent/eidtTeamAddr.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="">
     <div class="">
-      <el-button type="primary" @click="addAddr">新建地址</el-button>
+      <el-button type="primary" class="addBtn" @click="addAddr">新建地址</el-button>
       <div class="tableWrap">
         <el-table
           :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
@@ -38,8 +38,8 @@
         />
       </div>
     </div>
-    <el-dialog :visible.sync="addrVisiable" :title="activeRow&&activeRow.id?'修改地址':'新增地址'" width="400px">
-      <eidtAddr v-if="addrVisiable" :form="activeRow"/>
+    <el-dialog :visible.sync="addrVisiable" :title="activeRow&&activeRow.id?'修改地址':'新增地址'" width="500px">
+      <eidtAddr v-if="addrVisiable" :form="activeRow" ref='eidtAddr' @getList='getList'/>
       <div slot="footer" class="dialog-footer">
         <el-button @click="addrVisiable = false">取 消</el-button>
         <el-button type="primary" @click="submitAddr"
@@ -51,7 +51,7 @@
 </template>
 <script>
 
-import { getMusicGroupAddr} from '../api'
+import { getMusicGroupAddr,deleteMusicGroupAddr} from '../api'
 import qs from "qs";
 import eidtAddr from './modals/eidtAddr.vue'
 import pagination from "@/components/Pagination/index";
@@ -94,7 +94,7 @@ export default {
 
     },
     getList(){
-      console.log('getList')
+      this.addrVisiable=false;
       if (this.teamid) {
         // getTeamList({ musicGroupId: this.teamid }).then(res=>{
         //   if(res.code == 200){
@@ -115,15 +115,31 @@ export default {
       this.$router.push({ path: "/teamList" });
     },
     resetAddr(row){},
-    deleteAddr(row){},
+   async deleteAddr(row){
+    try{
+      await this.$confirm("是否确认删除此收货地址?", "提示", {
+          type: "warning",
+        });
+      const res = await deleteMusicGroupAddr({id:row.id})
+      this.$message.success('删除成功')
+      this.getList()
+    }catch(e){
+      console.log(e)
+    }
+    },
     addAddr(){
       this.activeRow = null;
       this.addrVisiable = true;
     },
-    submitAddr(){}
+    submitAddr(){
+      this.$refs.eidtAddr.submit()
+    }
   },
 };
 </script>
 
 <style lang="scss" scoped>
+.addBtn {
+  margin-bottom: 20px;
+}
 </style>

src/views/teamDetail/teamListComponent/modals/eidtAddr.vue

@@ -16,9 +16,7 @@
       <el-form-item
         label="手机号"
         prop="mobile"
-        :rules="[
-          { required: true, message: '请输入手机号', trigger: 'blur' },
-        ]"
+        :rules="[{ required: true, message: '请输入手机号', trigger: 'blur' }]"
       >
         <el-input
           v-model.trim="forms.mobile"
@@ -26,63 +24,91 @@
         ></el-input>
       </el-form-item>
       <el-form-item label="所在城市" required>
-        <br>
+        <br />
         <div class="provinceWrap">
           <el-form-item
-          prop="province"
-          :rules="[{ required: true, message: '请选择省', trigger: 'change' }]"
-          style="margin-right: 0"
-        >
-          <el-select
-            v-model.trim="forms.province"
-            filterable
-            placeholder="请选择省"
-            clearable
-            style="width: 148px !important;margin-right:5px;"
-            @change="onChangeProvince"
+            prop="regionProvince"
+            :rules="[
+              { required: true, message: '请选择省', trigger: 'change' },
+            ]"
+            style="margin-right: 0"
+          >
+            <el-select
+              v-model.trim="forms.regionProvince"
+              filterable
+              placeholder="请选择省"
+              clearable
+              style="width: 148px !important; margin-right: 5px"
+              @change="onChangeProvince"
+            >
+              <el-option
+                v-for="item in provinceList"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item
+            prop="regionCity"
+            :rules="[
+              { required: true, message: '请选择市', trigger: 'change' },
+            ]"
+            style="margin-right: 0"
           >
-            <el-option
-              v-for="item in provinceList"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"
-            ></el-option>
-          </el-select>
-        </el-form-item>
-        <el-form-item
-          prop="city"
-          :rules="[{ required: true, message: '请选择市', trigger: 'change' }]"
-          style="margin-right: 0"
-        >
-          <el-select
-            v-model.trim="forms.city"
-            filterable
-            :disabled="!forms.province"
-            style="width: 148px !important"
-            placeholder="请选择市"
-            clearable
+            <el-select
+              v-model.trim="forms.regionCity"
+              filterable
+              :disabled="!forms.regionProvince"
+              style="width: 148px !important; margin-right: 5px"
+              placeholder="请选择市"
+              @change="onChangeCity"
+              clearable
+            >
+              <el-option
+                v-for="item in cityList"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item
+            prop="regionCounty"
+            :rules="[
+              { required: true, message: '请选择地区', trigger: 'change' },
+            ]"
+            style="margin-right: 0"
           >
-            <el-option
-              v-for="item in cityList"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"
-            ></el-option>
-          </el-select>
-        </el-form-item>
+            <el-select
+              v-model.trim="forms.regionCounty"
+              filterable
+              :disabled="!forms.regionCity"
+              style="width: 148px !important"
+              placeholder="请选择地区"
+              clearable
+            >
+              <el-option
+                v-for="item in countyList"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              ></el-option>
+            </el-select>
+          </el-form-item>
         </div>
-
       </el-form-item>
       <el-form-item
         label="详细地址"
         prop="address"
         :rules="[
-          { required: true, message: '请输入详细地址', trigger: 'blur' }
+          { required: true, message: '请输入详细地址', trigger: 'blur' },
         ]"
       >
         <el-input
           v-model.trim="forms.address"
-
+          type="textarea"
+          :rows="3"
           placeholder="请输入详细地址"
         ></el-input>
       </el-form-item>
@@ -91,66 +117,72 @@
 </template>
 <script>
 import { areaQueryChild, getParentArea } from "@/api/specialSetting";
-
+import { addMusicGroupAddr,resetMusicGroupAddr } from "../../api";
 export default {
-  props:['form'],
+  props: ["form"],
   data() {
     return {
-      forms:{
-        consigneeName:'',
-        mobile:'',
-        detailAddress:'',
-        musicGroupId:'',
-        regionProvince:'',
-        regionCity:'',
-        regionCounty:''
+      forms: {
+        consigneeName: "",
+        mobile: "",
+        detailAddress: "",
+        musicGroupId: "",
+        regionProvince: "",
+        regionCity: "",
+        regionCounty: "",
       },
-      provinceList:[],
-      cityList:[],
-      countyList:[]
-
+      provinceList: [],
+      cityList: [],
+      countyList: [],
     };
-  },async mounted(){
+  },
+  async mounted() {
+    if(this.form){
+      this.forms = {...this.form}
+    }
     await this.getAreaList();
     if (this.forms.regionCity) {
-      await getParentArea({ id: this.forms.regionCity }).then(async res => {
+      await getParentArea({ id: this.forms.regionCity }).then(async (res) => {
         if (res.code == 200 && res.data) {
-          await this.getAreaList(res.data.id,'regionCity', () => {
+          await this.getAreaList(res.data.id, "regionCity", () => {
             this.$set(this.forms, "regionProvince", res.data.id);
             this.$set(this.forms, "regionCity", this.forms.regionCity);
-
           });
-
         }
       });
-      if(this.forms.regionCity){
-        await this.getAreaList(this.forms.regionCity,'regionCounty');
+      if (this.forms.regionCity) {
+        await this.getAreaList(this.forms.regionCity, "regionCounty");
       }
     } else {
       this.$set(this.forms, "regionProvince", null);
       this.$set(this.forms, "city", null);
     }
   },
-  methods:{
+  methods: {
     onChangeProvince(val) {
-      this.forms.city = null;
-      this.getAreaList(val);
+      this.forms.regionCity = null;
+      this.forms.regionCounty = null;
+      this.getAreaList(val, "");
+    },
+    onChangeCity(val) {
+      this.forms.regionCounty = null;
+      this.getAreaList(val, "regionCounty");
     },
-    getAreaList(parentId,type, callback) {
+    getAreaList(parentId, type, callback) {
       parentId = parentId ? parentId : 0;
-      areaQueryChild({ parentId: parentId }).then(res => {
+      areaQueryChild({ parentId: parentId }).then((res) => {
         if (res.code == 200 && res.data) {
           let tempData = [];
-          res.data.forEach(item => {
+          res.data.forEach((item) => {
             tempData.push({
               label: item.name,
-              value: item.id
+              value: item.id,
             });
           });
           if (parentId) {
-            if(type =='regionCounty'){
+            if (type == "regionCounty") {
               this.countyList = tempData;
-            }else {
+            } else {
               this.cityList = tempData;
             }
           } else {
@@ -163,7 +195,32 @@ export default {
         }
       });
     },
-  }
+    async submit() {
+      this.$refs.form.validate(async (flag) => {
+        if (flag) {
+          if (this.forms.id) {
+            // 修改  resetMusicGroupAddr
+            try {
+              const res = await resetMusicGroupAddr({ ...this.forms });
+              this.$message.success("修改成功");
+              this.$emit("getList");
+            } catch (e) {
+              console.log(e);
+            }
+          } else {
+            // 新增
+            try {
+              const res = await addMusicGroupAddr({ ...this.forms });
+              this.$message.success("添加成功");
+              this.$emit("getList");
+            } catch (e) {
+              console.log(e);
+            }
+          }
+        }
+      });
+    },
+  },
 };
 </script>