到提交按钮

1

src/views/teamDetail/teamDetailedList.vue

@@ -1,334 +1,51 @@
 <template>
-  <div class="">
-    <!-- m-container -->
-    <!-- <h2>
-      <el-page-header @back="onCancel"
-                      content="发放清单"></el-page-header>
-    </h2> -->
-    <!-- <div class="headWrap">
-      <div class="left">
-        <div class="headItem">
-          <p>乐团名称:<span>12345</span></p>
-        </div>
-        <div class="headItem">
-          <p>生成时间:<span>12345</span></p>
-        </div>
-        <div class="headItem">
-          <p>确认人:<span>12345</span></p>
-        </div>
-      </div>
-      <div class="right">
-      </div>
-    </div> -->
-    <div class="m-core">
-      <div class="tableWrap">
-        <el-table
-          :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
-          :data="tableList"
-        >
-          <el-table-column label="商品编号" prop="sn" align="center">
-          </el-table-column>
-          <el-table-column label="商品名称" align="center" prop="name">
-          </el-table-column>
-          <el-table-column label="商品类型" align="center" prop="type">
-            <template slot-scope="scope">
-              <div>
-                {{ scope.row.type | shopType }}
-              </div>
-            </template>
-          </el-table-column>
-          <el-table-column label="具体型号" align="center" prop="specification">
-          </el-table-column>
-          <el-table-column label="数量统计" align="center" prop="sellCount">
-          </el-table-column>
-        </el-table>
-      </div>
-    </div>
-    <div class="btnWrap" style="margin-top: 20px">
-      <el-button
-        type="primary"
-        v-if="tableList.length > 0"
-        v-permission="'order/musicalListExport'"
-        @click="musicalListExport"
-        >订货清单导出</el-button
-      >
-      <el-button
-        type="primary"
-        v-if="tableList.length > 0"
-        v-permission="'order/musicalListDetailExport'"
-        @click="musicalListDetailExport"
-        >分发清单导出</el-button
-      >
-      <el-button
-        type="primary"
-        @click="onDelivery"
-        v-if="musicalStatus && $helpers.permission('musicGroup/takeEffectOfinstrumentInsurance')"
-        >确认发货</el-button>
-      <el-button
-        type="warning okBtn"
-        v-if="team_status == 'PREPARE'&&!hasVerifyMusicalList"
-        v-permission="'order/verifyMusicalList'"
-        @click="okDetailList"
-        >乐器清单确认</el-button
-      >
-      <!-- <div class="okBtn" v-permission="'order/verifyMusicalList'"
-           @click="okDetailList">确认</div> -->
-    </div>
+  <div class="teamDetailedList">
+    <el-tabs v-model="activeName">
+      <el-tab-pane label="已发清单" name="waitTeamList">
+        <waitTeamList />
+      </el-tab-pane>
+      <el-tab-pane label="待发清单" name="endTeamList">
+        <endTeamList />
+      </el-tab-pane>
+      <el-tab-pane label="收货地址" name="eidtTeamAddr">
+        <eidtTeamAddr />
+      </el-tab-pane>
+
+    </el-tabs>
   </div>
 </template>
 <script>
-import { getTeamDetailList, getTeamBaseInfo } from "@/api/buildTeam";
-import { getTeamList } from "@/api/teamServer";
-import { verifyMusicalList, takeEffectOfinstrumentInsurance } from "@/api/orderManager";
-import axios from "axios";
-import qs from "qs";
-import { getToken, getTenantId } from "@/utils/auth";
-import load from "@/utils/loading";
+import waitTeamList from './teamListComponent/waitTeamList.vue'
+import endTeamList from './teamListComponent/endTeamList.vue'
+import eidtTeamAddr from './teamListComponent/eidtTeamAddr.vue'
 export default {
   data() {
     return {
-      teamid: "",
-      tableList: [],
-      Fsearch: null,
-      Frules: null,
-      team_status: "",
-      musicalInstrumentsProvideStatus: 0, // 是否确认发货  1已发货
-      hasVerifyMusicalList:true
+      activeName:'waitTeamList'
     };
   },
+  components:{
+    waitTeamList,
+    endTeamList,
+    eidtTeamAddr
+  },
   mounted() {
-    this.init();
+
   },
   activated() {
-    this.init();
+
   },
   computed: {
-    musicalStatus() {
-      const template = ['PREPARE', 'PROGRESS']
-      const teamStatus = this.$route.query.team_status
-      const status = template.includes(teamStatus)
-      console.log(this.musicalInstrumentsProvideStatus, status)
-      return !this.musicalInstrumentsProvideStatus && status ? true : false
-    }
+
   },
   methods: {
-    init() {
-      this.team_status = this.$route.query.team_status;
-      this.teamid = this.$route.query.id;
-      if (this.teamid) {
-        // getTeamList({ musicGroupId: this.teamid }).then(res=>{
-        //   if(res.code == 200){
-        //     this.hasVerifyMusicalList = res?.data?.rows[0]?.hasVerifyMusicalList
-        //   }
-        // })
-        getTeamDetailList({ musicGroupId: this.teamid }).then((res) => {
-          if (res.code == 200) {
-            this.tableList = res.data ? res.data : [];
-          }
-        });
-        this.getMusicInfo()
-      }
-    },
-    async getMusicInfo() {
-        await getTeamBaseInfo({ musicGroupId: this.teamid }).then((res) => {
-          if (res.code == 200) {
-            this.musicalInstrumentsProvideStatus = res.data?.musicGroup?.musicalInstrumentsProvideStatus
-            this.hasVerifyMusicalList = res.data?.musicGroup?.hasVerifyMusicalList
-          }
-        });
-    },
-    onCancel() {
-      this.$store.dispatch("delVisitedViews", this.$route);
-      this.$router.push({ path: "/teamList" });
-    },
-    onDelivery() {
-      this.$confirm('是否确认发货', "提示", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning",
-      }).then(async () => {
-        try {
-          await takeEffectOfinstrumentInsurance({ musicGroupId: this.teamid })
-          this.$message.success('确定发货成功')
-          this.getMusicInfo()
-        } catch {
-          //
-        }
-      })
-    },
-    okDetailList() {
-      this.$confirm(`是否确认发放清单?`, "提示", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning",
-      })
-        .then(() => {
-          verifyMusicalList({ musicGroupId: this.teamid }).then((res) => {
-            if (res.code == 200) {
-               this.$store.dispatch("delVisitedViews", this.$route);
-              this.$router.push({
-                path: "/teamList",
-                query: { search: this.Fsearch, rules: this.Frules },
-              });
 
-            }
-          });
-        })
-        .catch(() => {});
-    },
-    musicalListExport() {
-      // 报表导出
-      let url = "/api-web/order/musicalListExport";
-      let data = {
-        musicGroupId: this.$route.query.id,
-      };
-      const options = {
-        method: "POST",
-        headers: {
-          Authorization: getToken(),
-          tenantId: getTenantId()
-        },
-        data: qs.stringify(data),
-        url,
-        responseType: "blob",
-      };
-      this.$confirm("您确定导出订货清单", "提示", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning",
-      })
-        .then(() => {
-          load.startLoading();
-          axios(options)
-            .then((res) => {
-              let blob = new Blob([res.data], {
-                // type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'
-                type: "application/vnd.ms-excel;charset=utf-8",
-                //word文档为application/msword,pdf文档为application/pdf,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8
-              });
-              let text = new Response(blob).text();
-              text.then((res) => {
-                // 判断是否报错
-                if (res.indexOf("code") != -1) {
-                  let json = JSON.parse(res);
-                  if(json.code == 403) {
-                    this.$message.error(`登录过期，请重新登录！`)
-                    setTimeout(() => {
-                      this.$store.dispatch('user/resetToken').then(() => {
-                        location.reload()
-                      })
-                    }, 1000);
-                    return
-                  }
-                  this.$message.error(json.msg);
-                } else {
-                  let objectUrl = URL.createObjectURL(blob);
-                  let link = document.createElement("a");
-                  let nowTime = new Date();
-                  let ymd =
-                    nowTime.getFullYear() +
-                    "" +
-                    (nowTime.getMonth() + 1) +
-                    "" +
-                    nowTime.getDate() +
-                    "" +
-                    nowTime.getHours() +
-                    "" +
-                    nowTime.getMinutes();
-                  let fname = this.$route.query.id + "-" + ymd + "订货清单.xls"; //下载文件的名字
-                  link.href = objectUrl;
-                  link.setAttribute("download", fname);
-                  document.body.appendChild(link);
-                  link.click();
-                }
-              });
-              load.endLoading();
-            })
-            .catch((error) => {
-              this.$message.error("导出数据失败，请联系管理员");
-              load.endLoading();
-            });
-        })
-        .catch(() => {});
-    },
-    musicalListDetailExport() {
-      // 报表导出
-      let url = "/api-web/order/musicalListDetailExport";
-      let data = {
-        musicGroupId: this.$route.query.id,
-      };
-      const options = {
-        method: "POST",
-        headers: {
-          Authorization: getToken(),
-          tenantId: getTenantId()
-        },
-        data: qs.stringify(data),
-        url,
-        responseType: "blob",
-      };
-      this.$confirm("您确定导出分发清单", "提示", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning",
-      })
-        .then(() => {
-          load.startLoading();
-          axios(options)
-            .then((res) => {
-              let blob = new Blob([res.data], {
-                // type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'
-                type: "application/vnd.ms-excel;charset=utf-8",
-                //word文档为application/msword,pdf文档为application/pdf,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8
-              });
-              let text = new Response(blob).text();
-              text.then((res) => {
-                // 判断是否报错
-                if (res.indexOf("code") != -1) {
-                  let json = JSON.parse(res);
-                  if(json.code == 403) {
-                    this.$message.error(`登录过期，请重新登录！`)
-                    setTimeout(() => {
-                      this.$store.dispatch('user/resetToken').then(() => {
-                        location.reload()
-                      })
-                    }, 1000);
-                    return
-                  }
-                  this.$message.error(json.msg);
-                } else {
-                  let objectUrl = URL.createObjectURL(blob);
-                  let link = document.createElement("a");
-                  let nowTime = new Date();
-                  let ymd =
-                    nowTime.getFullYear() +
-                    "" +
-                    (nowTime.getMonth() + 1) +
-                    "" +
-                    nowTime.getDate() +
-                    "" +
-                    nowTime.getHours() +
-                    "" +
-                    nowTime.getMinutes();
-                  let fname = this.$route.query.id + "-" + ymd + "分发清单.xls"; //下载文件的名字
-                  link.href = objectUrl;
-                  link.setAttribute("download", fname);
-                  document.body.appendChild(link);
-                  link.click();
-                }
-              });
-              load.endLoading();
-            })
-            .catch((error) => {
-              this.$message.error("导出数据失败，请联系管理员");
-              load.endLoading();
-            });
-        })
-        .catch(() => {});
-    },
   },
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
+.teamDetailedList {
+  padding: 0 20px;
+}
 </style>

src/views/teamDetail/teamListComponent/eidtTeamAddr.vue

@@ -0,0 +1,28 @@
+<template>
+  <div class="eidtAddrWrap">
+    <eidtAddr />
+    <el-button class="saveBtn" type="primary">保 存</el-button>
+  </div>
+</template>
+<script>
+import eidtAddr from './modals/eidtAddr'
+export default {
+  components:{
+    eidtAddr
+  },
+  data(){
+    return {
+
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .eidtAddrWrap {
+    width: 350px;
+  }
+  .saveBtn {
+    float: right;
+  }
+</style>

src/views/teamDetail/teamListComponent/endTeamList.vue

@@ -0,0 +1,314 @@
+<template>
+  <div class="">
+    <div class="">
+      <div class="tableWrap">
+        <el-table
+          :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
+          :data="tableList"
+        >
+          <el-table-column label="商品编号" prop="sn" align="center">
+          </el-table-column>
+          <el-table-column label="商品名称" align="center" prop="name">
+          </el-table-column>
+          <el-table-column label="商品类型" align="center" prop="type">
+            <template slot-scope="scope">
+              <div>
+                {{ scope.row.type | shopType }}
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column label="具体型号" align="center" prop="specification">
+          </el-table-column>
+          <el-table-column label="数量统计" align="center" prop="sellCount">
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <div class="btnWrap" style="margin-top: 20px">
+      <el-button
+        type="primary"
+        v-if="tableList.length > 0"
+        v-permission="'order/musicalListExport'"
+        @click="musicalListExport"
+        >订货清单导出</el-button
+      >
+      <el-button
+        type="primary"
+        v-if="tableList.length > 0"
+        v-permission="'order/musicalListDetailExport'"
+        @click="musicalListDetailExport"
+        >分发清单导出</el-button
+      >
+      <el-button
+        type="primary"
+        @click="onDelivery"
+        v-if="musicalStatus && $helpers.permission('musicGroup/takeEffectOfinstrumentInsurance')"
+        >确认发货</el-button>
+      <el-button
+        type="warning okBtn"
+        v-if="team_status == 'PREPARE'&&!hasVerifyMusicalList"
+        v-permission="'order/verifyMusicalList'"
+        @click="okDetailList"
+        >乐器清单确认</el-button
+      >
+      <!-- <div class="okBtn" v-permission="'order/verifyMusicalList'"
+           @click="okDetailList">确认</div> -->
+    </div>
+  </div>
+</template>
+<script>
+import { getTeamDetailList, getTeamBaseInfo } from "@/api/buildTeam";
+import { getTeamList } from "@/api/teamServer";
+import { verifyMusicalList, takeEffectOfinstrumentInsurance } from "@/api/orderManager";
+import axios from "axios";
+import qs from "qs";
+import { getToken, getTenantId } from "@/utils/auth";
+import load from "@/utils/loading";
+export default {
+  data() {
+    return {
+      teamid: "",
+      tableList: [],
+      Fsearch: null,
+      Frules: null,
+      team_status: "",
+      musicalInstrumentsProvideStatus: 0, // 是否确认发货  1已发货
+      hasVerifyMusicalList:true
+    };
+  },
+  mounted() {
+    this.init();
+  },
+  activated() {
+    this.init();
+  },
+  computed: {
+    musicalStatus() {
+      const template = ['PREPARE', 'PROGRESS']
+      const teamStatus = this.$route.query.team_status
+      const status = template.includes(teamStatus)
+      console.log(this.musicalInstrumentsProvideStatus, status)
+      return !this.musicalInstrumentsProvideStatus && status ? true : false
+    }
+  },
+  methods: {
+    init() {
+      this.team_status = this.$route.query.team_status;
+      this.teamid = this.$route.query.id;
+      if (this.teamid) {
+        // getTeamList({ musicGroupId: this.teamid }).then(res=>{
+        //   if(res.code == 200){
+        //     this.hasVerifyMusicalList = res?.data?.rows[0]?.hasVerifyMusicalList
+        //   }
+        // })
+        getTeamDetailList({ musicGroupId: this.teamid }).then((res) => {
+          if (res.code == 200) {
+            this.tableList = res.data ? res.data : [];
+          }
+        });
+        this.getMusicInfo()
+      }
+    },
+    async getMusicInfo() {
+        await getTeamBaseInfo({ musicGroupId: this.teamid }).then((res) => {
+          if (res.code == 200) {
+            this.musicalInstrumentsProvideStatus = res.data?.musicGroup?.musicalInstrumentsProvideStatus
+            this.hasVerifyMusicalList = res.data?.musicGroup?.hasVerifyMusicalList
+          }
+        });
+    },
+    onCancel() {
+      this.$store.dispatch("delVisitedViews", this.$route);
+      this.$router.push({ path: "/teamList" });
+    },
+    onDelivery() {
+      this.$confirm('是否确认发货', "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      }).then(async () => {
+        try {
+          await takeEffectOfinstrumentInsurance({ musicGroupId: this.teamid })
+          this.$message.success('确定发货成功')
+          this.getMusicInfo()
+        } catch {
+          //
+        }
+      })
+    },
+    okDetailList() {
+      this.$confirm(`是否确认发放清单?`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          verifyMusicalList({ musicGroupId: this.teamid }).then((res) => {
+            if (res.code == 200) {
+               this.$store.dispatch("delVisitedViews", this.$route);
+              this.$router.push({
+                path: "/teamList",
+                query: { search: this.Fsearch, rules: this.Frules },
+              });
+
+            }
+          });
+        })
+        .catch(() => {});
+    },
+    musicalListExport() {
+      // 报表导出
+      let url = "/api-web/order/musicalListExport";
+      let data = {
+        musicGroupId: this.$route.query.id,
+      };
+      const options = {
+        method: "POST",
+        headers: {
+          Authorization: getToken(),
+          tenantId: getTenantId()
+        },
+        data: qs.stringify(data),
+        url,
+        responseType: "blob",
+      };
+      this.$confirm("您确定导出订货清单", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          load.startLoading();
+          axios(options)
+            .then((res) => {
+              let blob = new Blob([res.data], {
+                // type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'
+                type: "application/vnd.ms-excel;charset=utf-8",
+                //word文档为application/msword,pdf文档为application/pdf,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8
+              });
+              let text = new Response(blob).text();
+              text.then((res) => {
+                // 判断是否报错
+                if (res.indexOf("code") != -1) {
+                  let json = JSON.parse(res);
+                  if(json.code == 403) {
+                    this.$message.error(`登录过期，请重新登录！`)
+                    setTimeout(() => {
+                      this.$store.dispatch('user/resetToken').then(() => {
+                        location.reload()
+                      })
+                    }, 1000);
+                    return
+                  }
+                  this.$message.error(json.msg);
+                } else {
+                  let objectUrl = URL.createObjectURL(blob);
+                  let link = document.createElement("a");
+                  let nowTime = new Date();
+                  let ymd =
+                    nowTime.getFullYear() +
+                    "" +
+                    (nowTime.getMonth() + 1) +
+                    "" +
+                    nowTime.getDate() +
+                    "" +
+                    nowTime.getHours() +
+                    "" +
+                    nowTime.getMinutes();
+                  let fname = this.$route.query.id + "-" + ymd + "订货清单.xls"; //下载文件的名字
+                  link.href = objectUrl;
+                  link.setAttribute("download", fname);
+                  document.body.appendChild(link);
+                  link.click();
+                }
+              });
+              load.endLoading();
+            })
+            .catch((error) => {
+              this.$message.error("导出数据失败，请联系管理员");
+              load.endLoading();
+            });
+        })
+        .catch(() => {});
+    },
+    musicalListDetailExport() {
+      // 报表导出
+      let url = "/api-web/order/musicalListDetailExport";
+      let data = {
+        musicGroupId: this.$route.query.id,
+      };
+      const options = {
+        method: "POST",
+        headers: {
+          Authorization: getToken(),
+          tenantId: getTenantId()
+        },
+        data: qs.stringify(data),
+        url,
+        responseType: "blob",
+      };
+      this.$confirm("您确定导出分发清单", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          load.startLoading();
+          axios(options)
+            .then((res) => {
+              let blob = new Blob([res.data], {
+                // type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'
+                type: "application/vnd.ms-excel;charset=utf-8",
+                //word文档为application/msword,pdf文档为application/pdf,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8
+              });
+              let text = new Response(blob).text();
+              text.then((res) => {
+                // 判断是否报错
+                if (res.indexOf("code") != -1) {
+                  let json = JSON.parse(res);
+                  if(json.code == 403) {
+                    this.$message.error(`登录过期，请重新登录！`)
+                    setTimeout(() => {
+                      this.$store.dispatch('user/resetToken').then(() => {
+                        location.reload()
+                      })
+                    }, 1000);
+                    return
+                  }
+                  this.$message.error(json.msg);
+                } else {
+                  let objectUrl = URL.createObjectURL(blob);
+                  let link = document.createElement("a");
+                  let nowTime = new Date();
+                  let ymd =
+                    nowTime.getFullYear() +
+                    "" +
+                    (nowTime.getMonth() + 1) +
+                    "" +
+                    nowTime.getDate() +
+                    "" +
+                    nowTime.getHours() +
+                    "" +
+                    nowTime.getMinutes();
+                  let fname = this.$route.query.id + "-" + ymd + "分发清单.xls"; //下载文件的名字
+                  link.href = objectUrl;
+                  link.setAttribute("download", fname);
+                  document.body.appendChild(link);
+                  link.click();
+                }
+              });
+              load.endLoading();
+            })
+            .catch((error) => {
+              this.$message.error("导出数据失败，请联系管理员");
+              load.endLoading();
+            });
+        })
+        .catch(() => {});
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+</style>

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

@@ -0,0 +1,160 @@
+<template>
+  <div>
+    <el-form :model="forms" ref="form">
+      <el-form-item
+        label="联系人"
+        prop="consigneeName"
+        :rules="[
+          { required: true, message: '请输入联系人姓名', trigger: 'blur' },
+        ]"
+      >
+        <el-input
+          v-model.trim="forms.consigneeName"
+          placeholder="请输入联系人姓名"
+        ></el-input>
+      </el-form-item>
+      <el-form-item
+        label="手机号"
+        prop="mobile"
+        :rules="[
+          { required: true, message: '请输入手机号', trigger: 'blur' },
+        ]"
+      >
+        <el-input
+          v-model.trim="forms.mobile"
+          placeholder="请输入手机号"
+        ></el-input>
+      </el-form-item>
+      <el-form-item label="所在城市" required>
+        <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"
+          >
+            <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-option
+              v-for="item in cityList"
+              :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' }
+        ]"
+      >
+        <el-input
+          v-model.trim="forms.address"
+
+          placeholder="请输入详细地址"
+        ></el-input>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+<script>
+import { areaQueryChild, getParentArea } from "@/api/specialSetting";
+export default {
+  data() {
+    return {
+      forms:{
+        consigneeName:'',
+        mobile:'',
+
+      },
+      provinceList:[],
+      cityList:[]
+
+    };
+  },async mounted(){
+    await this.getAreaList();
+    if (this.forms.areaId) {
+      await getParentArea({ id: this.forms.areaId }).then(async res => {
+        if (res.code == 200 && res.data) {
+          await this.getAreaList(res.data.id, () => {
+            this.$set(this.forms, "province", res.data.id);
+            this.$set(this.forms, "city", this.forms.areaId);
+          });
+        }
+      });
+    } else {
+      this.$set(this.forms, "province", null);
+      this.$set(this.forms, "city", null);
+    }
+  },
+  methods:{
+    onChangeProvince(val) {
+      this.forms.city = null;
+      this.getAreaList(val);
+    },
+    getAreaList(parentId, callback) {
+      parentId = parentId ? parentId : 0;
+      areaQueryChild({ parentId: parentId }).then(res => {
+        if (res.code == 200 && res.data) {
+          let tempData = [];
+          res.data.forEach(item => {
+            tempData.push({
+              label: item.name,
+              value: item.id
+            });
+          });
+          if (parentId) {
+            this.cityList = tempData;
+          } else {
+            this.provinceList = tempData;
+          }
+
+          if (callback && typeof callback == "function") {
+            callback();
+          }
+        }
+      });
+    },
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.provinceWrap {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+</style>

src/views/teamDetail/teamListComponent/waitTeamList.vue

@@ -0,0 +1,327 @@
+<template>
+  <div class="">
+    <div class="">
+      <div class="tableWrap">
+        <el-table
+          :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
+          :data="tableList"
+        >
+          <el-table-column type="selection" width="55"> </el-table-column>
+          <el-table-column label="商品编号" prop="sn" align="center">
+          </el-table-column>
+          <el-table-column label="商品名称" align="center" prop="name">
+          </el-table-column>
+          <el-table-column label="商品类型" align="center" prop="type">
+            <template slot-scope="scope">
+              <div>
+                {{ scope.row.type | shopType }}
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column label="具体型号" align="center" prop="specification">
+          </el-table-column>
+          <el-table-column label="数量统计" align="center" prop="sellCount">
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <div class="btnWrap" style="margin-top: 20px">
+      <el-button
+        type="primary"
+        v-if="tableList.length > 0"
+        v-permission="'order/musicalListExport'"
+        @click="musicalListExport"
+        >订货清单导出</el-button
+      >
+      <el-button
+        type="primary"
+        v-if="tableList.length > 0"
+        v-permission="'order/musicalListDetailExport'"
+        @click="musicalListDetailExport"
+        >分发清单导出</el-button
+      >
+      <el-button
+        type="primary"
+        @click="onDelivery"
+        v-if="
+          musicalStatus &&
+          $helpers.permission('musicGroup/takeEffectOfinstrumentInsurance')
+        "
+        >确认发货</el-button
+      >
+      <el-button
+        type="warning okBtn"
+        v-if="team_status == 'PREPARE' && !hasVerifyMusicalList"
+        v-permission="'order/verifyMusicalList'"
+        @click="okDetailList"
+        >乐器清单确认</el-button
+      >
+      <!-- <div class="okBtn" v-permission="'order/verifyMusicalList'"
+           @click="okDetailList">确认</div> -->
+    </div>
+  </div>
+</template>
+<script>
+import { getTeamDetailList, getTeamBaseInfo } from "@/api/buildTeam";
+import { getTeamList } from "@/api/teamServer";
+import {
+  verifyMusicalList,
+  takeEffectOfinstrumentInsurance,
+} from "@/api/orderManager";
+import axios from "axios";
+import qs from "qs";
+import { getToken, getTenantId } from "@/utils/auth";
+import load from "@/utils/loading";
+export default {
+  data() {
+    return {
+      teamid: "",
+      tableList: [],
+      Fsearch: null,
+      Frules: null,
+      team_status: "",
+      musicalInstrumentsProvideStatus: 0, // 是否确认发货  1已发货
+      hasVerifyMusicalList: true,
+      activeChiose:[]
+    };
+  },
+  mounted() {
+    this.init();
+  },
+  activated() {
+    this.init();
+  },
+  computed: {
+    musicalStatus() {
+      const template = ["PREPARE", "PROGRESS"];
+      const teamStatus = this.$route.query.team_status;
+      const status = template.includes(teamStatus);
+      console.log(this.musicalInstrumentsProvideStatus, status);
+      return !this.musicalInstrumentsProvideStatus && status ? true : false;
+    },
+  },
+  methods: {
+    init() {
+      this.team_status = this.$route.query.team_status;
+      this.teamid = this.$route.query.id;
+      if (this.teamid) {
+        // getTeamList({ musicGroupId: this.teamid }).then(res=>{
+        //   if(res.code == 200){
+        //     this.hasVerifyMusicalList = res?.data?.rows[0]?.hasVerifyMusicalList
+        //   }
+        // })
+        getTeamDetailList({ musicGroupId: this.teamid }).then((res) => {
+          if (res.code == 200) {
+            this.tableList = res.data ? res.data : [];
+          }
+        });
+        this.getMusicInfo();
+      }
+    },
+    async getMusicInfo() {
+      await getTeamBaseInfo({ musicGroupId: this.teamid }).then((res) => {
+        if (res.code == 200) {
+          this.musicalInstrumentsProvideStatus =
+            res.data?.musicGroup?.musicalInstrumentsProvideStatus;
+          this.hasVerifyMusicalList =
+            res.data?.musicGroup?.hasVerifyMusicalList;
+        }
+      });
+    },
+    handleSelectionChange (val) {
+      this.activeChiose = val
+    },
+    onCancel() {
+      this.$store.dispatch("delVisitedViews", this.$route);
+      this.$router.push({ path: "/teamList" });
+    },
+    onDelivery() {
+      this.$confirm("是否确认发货", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      }).then(async () => {
+        try {
+          await takeEffectOfinstrumentInsurance({ musicGroupId: this.teamid });
+          this.$message.success("确定发货成功");
+          this.getMusicInfo();
+        } catch {
+          //
+        }
+      });
+    },
+    okDetailList() {
+      this.$confirm(`是否确认发放清单?`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          verifyMusicalList({ musicGroupId: this.teamid }).then((res) => {
+            if (res.code == 200) {
+              this.$store.dispatch("delVisitedViews", this.$route);
+              this.$router.push({
+                path: "/teamList",
+                query: { search: this.Fsearch, rules: this.Frules },
+              });
+            }
+          });
+        })
+        .catch(() => {});
+    },
+    musicalListExport() {
+      // 报表导出
+      let url = "/api-web/order/musicalListExport";
+      let data = {
+        musicGroupId: this.$route.query.id,
+      };
+      const options = {
+        method: "POST",
+        headers: {
+          Authorization: getToken(),
+          tenantId: getTenantId(),
+        },
+        data: qs.stringify(data),
+        url,
+        responseType: "blob",
+      };
+      this.$confirm("您确定导出订货清单", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          load.startLoading();
+          axios(options)
+            .then((res) => {
+              let blob = new Blob([res.data], {
+                // type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'
+                type: "application/vnd.ms-excel;charset=utf-8",
+                //word文档为application/msword,pdf文档为application/pdf,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8
+              });
+              let text = new Response(blob).text();
+              text.then((res) => {
+                // 判断是否报错
+                if (res.indexOf("code") != -1) {
+                  let json = JSON.parse(res);
+                  if (json.code == 403) {
+                    this.$message.error(`登录过期，请重新登录！`);
+                    setTimeout(() => {
+                      this.$store.dispatch("user/resetToken").then(() => {
+                        location.reload();
+                      });
+                    }, 1000);
+                    return;
+                  }
+                  this.$message.error(json.msg);
+                } else {
+                  let objectUrl = URL.createObjectURL(blob);
+                  let link = document.createElement("a");
+                  let nowTime = new Date();
+                  let ymd =
+                    nowTime.getFullYear() +
+                    "" +
+                    (nowTime.getMonth() + 1) +
+                    "" +
+                    nowTime.getDate() +
+                    "" +
+                    nowTime.getHours() +
+                    "" +
+                    nowTime.getMinutes();
+                  let fname = this.$route.query.id + "-" + ymd + "订货清单.xls"; //下载文件的名字
+                  link.href = objectUrl;
+                  link.setAttribute("download", fname);
+                  document.body.appendChild(link);
+                  link.click();
+                }
+              });
+              load.endLoading();
+            })
+            .catch((error) => {
+              this.$message.error("导出数据失败，请联系管理员");
+              load.endLoading();
+            });
+        })
+        .catch(() => {});
+    },
+    musicalListDetailExport() {
+      // 报表导出
+      let url = "/api-web/order/musicalListDetailExport";
+      let data = {
+        musicGroupId: this.$route.query.id,
+      };
+      const options = {
+        method: "POST",
+        headers: {
+          Authorization: getToken(),
+          tenantId: getTenantId(),
+        },
+        data: qs.stringify(data),
+        url,
+        responseType: "blob",
+      };
+      this.$confirm("您确定导出分发清单", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          load.startLoading();
+          axios(options)
+            .then((res) => {
+              let blob = new Blob([res.data], {
+                // type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'
+                type: "application/vnd.ms-excel;charset=utf-8",
+                //word文档为application/msword,pdf文档为application/pdf,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8
+              });
+              let text = new Response(blob).text();
+              text.then((res) => {
+                // 判断是否报错
+                if (res.indexOf("code") != -1) {
+                  let json = JSON.parse(res);
+                  if (json.code == 403) {
+                    this.$message.error(`登录过期，请重新登录！`);
+                    setTimeout(() => {
+                      this.$store.dispatch("user/resetToken").then(() => {
+                        location.reload();
+                      });
+                    }, 1000);
+                    return;
+                  }
+                  this.$message.error(json.msg);
+                } else {
+                  let objectUrl = URL.createObjectURL(blob);
+                  let link = document.createElement("a");
+                  let nowTime = new Date();
+                  let ymd =
+                    nowTime.getFullYear() +
+                    "" +
+                    (nowTime.getMonth() + 1) +
+                    "" +
+                    nowTime.getDate() +
+                    "" +
+                    nowTime.getHours() +
+                    "" +
+                    nowTime.getMinutes();
+                  let fname = this.$route.query.id + "-" + ymd + "分发清单.xls"; //下载文件的名字
+                  link.href = objectUrl;
+                  link.setAttribute("download", fname);
+                  document.body.appendChild(link);
+                  link.click();
+                }
+              });
+              load.endLoading();
+            })
+            .catch((error) => {
+              this.$message.error("导出数据失败，请联系管理员");
+              load.endLoading();
+            });
+        })
+        .catch(() => {});
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+</style>