<template>
  <div class="outOrderTable">
    <el-table
      ref="addrForm"
      :data="tableData"
      border
      :size="'mini'"
      style="width: 100%"
      row-key="key"
      @selection-change="handleSelectionChange"
    >
      <el-table-column
        show-overflow-tooltip
        prop="outChildCode"
        label="发货工单编号"
        width="160"
      />s

      <el-table-column
        show-overflow-tooltip
        prop="outCode"
        label="发货单编号"
        width="160"
      />


      <el-table-column
        show-overflow-tooltip
        prop="orderCode"
        label="销售订单编号"
        width="160"
      />

      <el-table-column show-overflow-tooltip prop="send_status" label="状态" width="105">
        <template slot-scope="scope">
          <el-tag
            :size="tablebtnSize"
            :type="scope.row.status == '0' ? 'warning' : ''"
            v-text="
              (statusOptions.find((item) => item.id == scope.row.status) || {}).label ||
              '--'
            "
          ></el-tag>
        </template>
      </el-table-column>

      <el-table-column
        show-overflow-tooltip
        prop="num"
        label="数量"
        width="80"
      />

      <el-table-column show-overflow-tooltip prop="post_code" label="物流单号" min-width="160" />
      <el-table-column show-overflow-tooltip prop="post_name" label="物流公司" min-width="160" />
      <el-table-column show-overflow-tooltip prop="wsm_name" label="仓库名称" min-width="160" />
      <el-table-column show-overflow-tooltip prop="wsm_code" label="仓库编号" min-width="160" />
      <el-table-column show-overflow-tooltip prop="addtime" label="下单时间" width="140" />
      <el-table-column show-overflow-tooltip prop="apply_name" label="申请人" width="110" />

      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-tooltip
            effect="dark"
            content="查看"
            placement="top"
            v-if="dpowers.some((i) => i == '007')"
          >
            <i
              class="el-icon-view tb-icon"
              @click="routeGoto('deliveryWorkOrderDetail', { id: scope.row.outChildCode })"
            ></i>
          </el-tooltip>
        </template>
      </el-table-column>
    </el-table>
    <div
      v-if="tableData && tableData.length > 0"
      class="Pagination"
      style="text-align: right; margin-top: 10px"
    >
      <el-pagination
        :current-page="parmValue.page"
        :page-size="parmValue.size"
        :size="'mini'"
        layout="total,  prev, pager, next, jumper"
        :total="pageInfo.total"
        @size-change="page_size_change"
        @current-change="page_curr_change"
      />
    </div>

    <out-order-add-model
      :showModel="modelShowModel"
      :id="modelId"
      :sitem="modelItem"
      @refresh="refresh"
      @cancel="closeModel"
    />
    <in-addr-model
      :show-model="addrmodel"
      @cancel="addrmodel = false"
      @refresh="addrRefresh"
    />

    <add-model
      :id="returnId"
      :sitem="returnItem"
      :show-model="returnModel"
      :is-detail="false"
      @refresh="refresh"
      @cancel="returnModel = false"
    />

    <add-return-all-model
      :id="returnAllId"
      :sitem="returnAllSitem"
      :show-model="returnAllShowModel"
      :is-detail="false"
      @refresh="refresh"
      @cancel="returnAllShowModel = false"
    />
  </div>
</template>
<script>
import mixinPage from "@/mixins/elPaginationHandle";
import resToken from "@/mixins/resToken";
import asyncRequest from "@/apis/service/sellOut/salesOrder/detail";
import outOrderAddModel from "./out-order-add-model";
import addModel from "@/views/sellOut/sellReturn/components/addModel";
import inAddrModel from "@/components/in-address-model";
import addReturnAllModel from "./addReturnAllModel";
import { mapGetters } from "vuex";

export default {
  name: "salesOrderDetail",
  mixins: [mixinPage, resToken],
  props: ["newTime", "id", "sitem"],
  components: { outOrderAddModel, addModel, inAddrModel, addReturnAllModel },
  watch: {
    newTime: function (val) {
      if (val) {
        this.initForm();
      }
    },
  },
  computed: {
    ...mapGetters(["tablebtnSize", "searchSize", "size"]),

    powers() {
      const tran =
        this.$store.getters.btnList.find(
          (item) => item.menu_route == "salesOrderDetail"
        ) || {};
      const { action } = tran ?? {};
      return action ?? [];
    },
    dpowers(){
      const tran =
        this.$store.getters.btnList.find(
          (item) => item.menu_route == "deliveryWorkOrderDetail"
        ) || {};
      const { action } = tran ?? {};
      return action ?? [];
    }
  },

  data() {
    return {
      orderCode: "",
      outCode: "",
      addr_res: 0,
      batch_num: 0,
      addrmodel: false,
      // 状态
      statusOptions: [
        { id: "1", label: "待发货" },
        { id: "2", label: "发货完成" },
        { id: "3", label: "已收货" },
        { id: "4", label: "已全部退货" },
      ],
      showGoodsModel: false,
      stock_code: "",
      tableData: [],
      loading: false,
      queryId: "",
      status: "",
      showModel: null,
      modelId: "",
      modelItem: null,
      s_sitem: null,
      returnId: "",
      returnItem: null,
      returnModel: false,
      wsend_num: "",
      orderCode: "",
      returnAllId: "",
      returnAllSitem: null,
      returnAllShowModel: false,
      parmValue: {},
      pageInfo: {
        size: 15,
        curr: 1,
        total: 0,
      },
      multipleSelection: [],
      resModel: null,
    };
  },
  watch:{
    sitem:{
      handler(){
        if(!this.sitem) return
        this.initForm();
      },
      immediate:true
    }
  },
  methods: {
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    closeModel() {
      this.modelId = "";
      this.modelShowModel = false;
    },
    refresh() {
      this.$emit("refresh");
      this.modelId = "";
      this.modelShowModel = false;
    },
    async initForm() {
      this.status = "";
      this.queryId = this.$route.query.id;
      // this.rulesThis = this.rules;
      this.resetForm();
    },
    async resetForm() {
      // 重置
      await this.$nextTick(async () => {
        await this.searchList();
      });
    },
    // 列表搜索
    async searchList() {
      const { code, data } = await asyncRequest.child_list({orderCode: this.sitem.orderCode});
      if (code === 0) {
        this.tableData = data;
      } else if (code >= 100 && code <= 104) {
        await this.logout();
      } else {
        this.tableData = [];
        this.pageInfo.total = 0;
      }
      this.loading = false;
    },
  },
};
</script>
<style lang="scss" scoped></style>
