<template>
  <div class="print-box">
    <el-row class="tem-row">
      <el-col :span="24">
        <div id="printTest" class="tem-img">
          <div class="clearfix" style="font-size: 12px">
            <div class="float_left">
              <span>打印时间:{{ no_time }}</span>
              <span v-if="orderDetail.printNum" style="margin-left: 10px">
                第{{ orderDetail.printNum + 1 }}次打印
              </span>
            </div>
            <div class="float_right">{{ enterprise_title }}提供技术支持</div>
          </div>
          <p style="font-size: 20px; text-align: center">
            <span v-if="form_obj.basic.indexOf('enterprise') > -1">
              {{ orderDetail.shopName }}
            </span>
            {{ info_list.templateName }}
          </p>

          <div class="infomation">
            <span v-if="form_obj.basic.indexOf('createTime') > -1">
              制单日期：{{ $_common.formatDate(orderDetail.createTime) }}
            </span>
            <span
              v-if="form_obj.basic.indexOf('orderNo') > -1"
              style="margin-left: 20px"
            >
              单据号：{{ orderDetail.no }}
            </span>
            <br />
          </div>
          <div class="infomation">
            <span
              v-if="form_obj.basic.indexOf('customerMobile') > -1"
              style="margin-right: 20px"
            >
              退货电话：{{ orderDetail.mobile }}
            </span>
            <span
              v-if="form_obj.basic.indexOf('customerName') > -1"
              style="margin-right: 20px"
            >
              退货人：{{ orderDetail.realName }}
            </span>
            <!--                <span v-if="form_obj.basic.indexOf('customerAddress')>-1">-->
            <!--                  收货地址：{{ orderDetail.receiveData.area.provinceName }}{{ orderDetail.receiveData.area.cityName }}{{ orderDetail.receiveData.area.districtName }}{{ orderDetail.receiveData.address }}-->
            <!--                </span>-->
            <br />
            <!--                <span-->
            <!--                  v-if="form_obj.other.indexOf('shopMobile')>-1"-->
            <!--                  style="margin-right: 20px"-->
            <!--                >-->
            <!--                  送货电话：{{ orderDetail.partnerPhone }}-->
            <!--                </span>-->
            <!--                <span-->
            <!--                  v-if="form_obj.other.indexOf('relname')>-1"-->
            <!--                  style="margin-right: 20px"-->
            <!--                >-->
            <!--                  店铺名称：{{ orderDetail.shopName }}-->
            <!--                </span>-->
            <!--                <span v-if="form_obj.basic.indexOf('deliveryType')>-1">-->
            <!--                  配送方式：{{ orderDetail.deliveryName }}-->
            <!--                </span>-->
          </div>

          <div>
            <div id="second">
              <table
                border="1"
                style="width: 100%; margin-top: 10px"
                class="goods-table"
              >
                <tr>
                  <th v-if="form_obj.goods.indexOf('goodsId') > -1">序号</th>
                  <th v-if="form_obj.goods.indexOf('goodsName') > -1">
                    商品名称
                  </th>
                  <th v-if="form_obj.goods.indexOf('unitName') > -1">单位</th>
                  <th v-if="form_obj.goods.indexOf('specName') > -1">属性</th>
                  <th v-if="form_obj.goods.indexOf('unitPrice') > -1">
                    退货单价
                  </th>
                  <th v-if="form_obj.goods.indexOf('buyNum') > -1">退货数量</th>
                  <th v-if="form_obj.goods.indexOf('totalPrice') > -1">
                    商品总价
                  </th>
                  <th
                    v-if="
                      EnToken === '8fa553d53f44e33123e4d0d51a0de634' ||
                      form_obj.goods.indexOf('strageCode') > -1
                    "
                  >
                    货架编码
                  </th>
                </tr>
                <tr v-for="(item, index) in orderDetail.details" :key="index">
                  <td v-if="form_obj.goods.indexOf('goodsId') > -1">
                    {{ index + 1 }}
                  </td>
                  <td v-if="form_obj.goods.indexOf('goodsName') > -1">
                    {{ item.goodsName }}
                  </td>
                  <td v-if="form_obj.goods.indexOf('unitName') > -1">
                    {{ item.unitName }}
                  </td>
                  <td v-if="form_obj.goods.indexOf('specName') > -1">
                    {{ item.skuName }}
                  </td>
                  <td v-if="form_obj.goods.indexOf('unitPrice') > -1">
                    {{ item.returnUnitPrice - 0 }}
                  </td>
                  <td v-if="form_obj.goods.indexOf('buyNum') > -1">
                    {{ item.num - 0 }}
                  </td>
                  <td v-if="form_obj.goods.indexOf('totalPrice') > -1">
                    {{ item.totalMoney }}
                  </td>
                  <td
                    v-if="
                      EnToken === '8fa553d53f44e33123e4d0d51a0de634' ||
                      form_obj.goods.indexOf('strageCode') > -1
                    "
                  >
                    {{ item.storege }}
                  </td>
                </tr>
                <tr>
                  <td colspan="1" style="text-align: center">合计：</td>
                  <td v-if="form_obj.goods.indexOf('goodsName') > -1">--</td>
                  <td v-if="form_obj.goods.indexOf('unitName') > -1">--</td>
                  <td v-if="form_obj.goods.indexOf('specName') > -1">--</td>
                  <td v-if="form_obj.goods.indexOf('unitPrice') > -1">--</td>
                  <td v-if="form_obj.goods.indexOf('buyNum') > -1">
                    {{ totalNum - 0 }}
                  </td>
                  <td v-if="form_obj.goods.indexOf('totalPrice') > -1">
                    {{ totalMoney }}
                  </td>
                  <td v-if="form_obj.goods.indexOf('strageCode') > -1">--</td>
                </tr>
                <tr v-if="form_obj.other.indexOf('remark') > -1">
                  <td colspan="9" class="remarks">
                    <pre>备注：{{ orderDetail.remark }}</pre>
                  </td>
                </tr>
              </table>
            </div>
          </div>
          <div class="sign clearfix">
            <span
              v-if="form_obj.other.indexOf('signature') > -1"
              class="float_left"
            >
              客户签字：
            </span>
            <span class="float_right">经手人：{{ userName }}</span>
            <!--                <span-->
            <!--                  class="sign_info"-->
            <!--                  v-if="form_obj.other.indexOf('signature')>-1"-->
            <!--                ></span>-->
            <!--                <span-->
            <!--                  style="margin-left: 30px"-->
            <!--                >送货人签字 :</span>-->
            <!--                <span-->
            <!--                  class="sign_info"-->
            <!--                ></span>-->
            <!--                <span-->
            <!--                  style="margin-left: 30px"-->
            <!--                >收货时间 :</span>-->
            <!--                <span-->
            <!--                  class="sign_info"-->
            <!--                ></span>-->
          </div>
        </div>
      </el-col>
    </el-row>
    <div style="text-align: center">
      <el-button
        v-print="'#printTest'"
        type="primary"
        @click="PrintNumPrintIncr"
      >
        确认打印（已打印{{ orderDetail.printNum || 0 }}次）
      </el-button>
    </div>
  </div>
</template>

<script>
  import { getEnToken } from "@/utils/accessToken";
  import { getOrderOut } from "@/api/Order";
  import { getTemplateInfo } from "@/api/System";
  import { PrintNumPrintIncr } from "@/api/common";
  export default {
    name: "OrderPrinting",
    data() {
      return {
        orderDetail: {
          details: [],
        },
        no_time: "",
        tableData: [],
        add_form: {},
        form_obj: {
          basic: [],
          fiance: [],
          goods: [],
          other: [],
        },
        meal_id: 6,
        info_list: [],
        EnToken: getEnToken(),
      };
    },
    computed: {
      totalNum() {
        if (!this.orderDetail.details.length) {
          return 0;
        } else if (this.orderDetail.details.length === 1) {
          return this.orderDetail.details[0].num;
        } else {
          let sum = 0;
          for (let i in this.orderDetail.details) {
            const item = this.orderDetail.details[i];
            sum = this.$NP.plus(sum, item.num);
          }
          return sum;
        }
      },
      totalMoney() {
        if (!this.orderDetail.details.length) {
          return 0;
        } else if (this.orderDetail.details.length === 1) {
          return this.orderDetail.details[0].totalMoney;
        } else {
          let sum = 0;
          for (let i in this.orderDetail.details) {
            const item = this.orderDetail.details[i];
            sum = this.$NP.plus(sum, Number(item.totalMoney));
          }
          return sum;
        }
      },
    },
    created() {
      this.no_time = this.$_common.formatDate(new Date().getTime());
      this.getTemplateInfo();
      this.getOrderOut();
    },
    methods: {
      async PrintNumPrintIncr() {
        const data = await PrintNumPrintIncr({
          objectNo: this.orderDetail.no,
          objectType: 6,
        });
        this.orderDetail.printNum += 1;
        setTimeout(() => {
          window.close();
        }, 1000);
      },
      async getTemplateInfo() {
        const data = await getTemplateInfo(this.meal_id);

        this.info_list = data.data.fieldsData;
        this.add_form = data.data.fieldsData.templateInfo;
        this.form_obj.basic = this.add_form.basic
          .filter((item) => item.isShow === 5)
          .map((item) => item.alias);
        this.form_obj.goods = this.add_form.goods
          .filter((item) => item.isShow === 5)
          .map((item) => item.alias);
        this.form_obj.fiance = this.add_form.fiance
          .filter((item) => item.isShow === 5)
          .map((item) => item.alias);
        this.form_obj.other = this.add_form.other
          .filter((item) => item.isShow === 5)
          .map((item) => item.alias);
      },
      async getOrderOut() {
        const data = await getOrderOut(this.$route.params.id);

        this.orderDetail = {
          ...data.data,
          details: data.data.details.map((item) => {
            return {
              ...item,
              totalMoney: item.returnUnitPrice * item.num,
            };
          }),
        };
      },
    },
  };
</script>

<style scoped>
  .tem-row {
    padding: 20px 80px;
  }
  .tem-img {
    width: 100%;
  }
  .infomation {
    margin-bottom: 5px;
    font-size: 14px;
  }
  .sign {
    margin-top: 10px;
    font-size: 14px;
  }
  .sign_info {
    background-color: black;
    height: 1px;
    width: 14%;
    margin-left: 10px;
    display: inline-block;
  }
  .line {
    height: 1px;
    background-color: black;
    width: 94%;
    margin-top: 10px;
  }
  .foot_info {
    font-size: 12px;
    text-align: right;
    /*margin-right: 40px;*/
  }
  .add_num {
    margin-right: 10px;
    font-size: 14px;
  }
  .goods-table th,
  .goods-table td {
    text-align: center;
    line-height: 28px;
    font-size: 14px;
  }
  .goods-table .remarks {
    line-height: 32px;
    text-align: left;
    padding-left: 5px;
    font-weight: bold;
  }
</style>
