dy-admin-manager/src/views/teamDetail/teamDetailedList.vue

<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="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 } from "@/api/buildTeam";
import { getTeamList } from "@/api/teamServer";
import { verifyMusicalList } from "@/api/orderManager";
import axios from "axios";
import qs from "qs";
import { getToken } from "@/utils/auth";
import load from "@/utils/loading";
export default {
  data() {
    return {
      teamid: "",
      tableList: [],
      Fsearch: null,
      Frules: null,
      team_status: "",
      hasVerifyMusicalList:true
    };
  },
  mounted() {
    this.init();
  },
  activated() {
    this.init();
  },
  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 : [];
          }
        });
      }
    },
    onCancel() {
      this.$store.dispatch("delVisitedViews", this.$route);
      this.$router.push({ path: "/teamList" });
    },
    okDetailList() {
      this.$confirm(`是否确认发放清单?`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          verifyMusicalList({ musicGroupId: this.teamid }).then((res) => {
            if (res.code == 200) {
              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(),
        },
        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);
                  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(),
        },
        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);
                  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>