ConsumSupplier-Platform/src/views/page/orderManage-sup/purOrderDelivery/devsuccs.vue

<template>
  <div class="wrap-print">
    <h2 v-if="listForm.quit == 'outbound'">出库成功</h2>
    <div class="btn-wrap">
      <el-button
        type="primary"
        @click="breakView()"
        v-if="listForm.quit == 'outbound'"
        >返回待出库</el-button
      >
      <el-button
        type="primary"
        @click="detailsData()"
        v-if="listForm.quit == 'outbound'"
        >出库详情</el-button
      >
      <el-button type="primary" v-print="printObj">打印出库单</el-button>
      <el-button
        type="primary"
        @click="goback()"
        v-if="listForm.quit == 'print'"
        >返回</el-button
      >
    </div>
    <el-card class="box-card">
      <printView :orderData="multipleSelection" :form="listForm"></printView>
    </el-card>
  </div>
</template>
<script>
import printView from "./printView.vue";
import { getSplerMcsDelvOrdPage } from "@/api/orderManage-sup/index";
export default {
  name: "successView",
  components: {
    printView
  },
  props: {},
  data() {
    return {
      multipleSelection: [],
      listForm: {},
      // 打印
      printObj: {
        id: "printData",
        popTitle: "", // 打印配置页上方标题
        extraHead: "", //最上方的头部文字，附加在head标签上的额外标签,使用逗号分隔
        preview: "", // 是否启动预览模式，默认是false（开启预览模式，可以先预览后打印）
        previewTitle: "", // 打印预览的标题（开启预览模式后出现）,
        previewPrintBtnLabel: "", // 打印预览的标题的下方按钮文本，点击可进入打印（开启预览模式后出现）
        zIndex: "", // 预览的窗口的z-index，默认是 20002（此值要高一些，这涉及到预览模式是否显示在最上面）
        previewBeforeOpenCallback() {}, //预览窗口打开之前的callback（开启预览模式调用）
        previewOpenCallback() {}, // 预览窗口打开之后的callback（开启预览模式调用）
        beforeOpenCallback: () => {}, // 开启打印前的回调事件
        openCallback() {}, // 调用打印之后的回调事件
        closeCallback() {}, //关闭打印的回调事件（无法确定点击的是确认还是取消）
        url: "",
        standard: "",
        extraCss: ""
      }
    };
  },
  created() {
    let { form, data } = this.$route.query;
    this.multipleSelection = JSON.parse(data);
    this.listForm = JSON.parse(form);
  },
  mounted() {},
  methods: {
    goback() {
      this.$router.go(-1);
    },
    //跳转出库详情
    detailsData() {
      getSplerMcsDelvOrdPage({
        delvOrdId: this.listForm.delvOrdId,
        purcOrdId: this.listForm.id
      }).then(res => {
        let data = res.data.records[0];
        this.$router.push({
          name: "alreadyDetail",
          query: {
            ...data,
            spdId: this.$route.query.form.spdId
          }
        });
      });
    },
    //返回待出库
    breakView() {
      this.$router.push({
        path: "/orderManage-sup/purOrderDelivery",
        query: {}
      });
    }
  },
  watch: {}
};
</script>
<style scoped lang="scss">
.wrap-print {
  padding: 20px;
  width: 100%;
  background: #fff;
  .btn-wrap {
    margin-top: 20px;
    width: 200px;
    height: 40px;
    display: flex;
    align-items: center;
  }
  .box-card {
    margin-top: 20px;
    width: 1200px;
  }
}
</style>