order-ui-pc/src/views/purchaseIn/purchaseOrder/components/workDiff-table.vue

<template>
  <div class="work-diff-table">
    <el-table
      ref="addrForm"
      :data="tableData"
      border
      :size="'mini'"
      style="width: 100%"
      row-key="key"
    >
      <el-table-column
        show-overflow-tooltip
        prop="orderCode"
        label="采购单编号"
        width="150"
      />

      <el-table-column
        show-overflow-tooltip
        prop="outCode"
        label="商品分类"
        width="150"
      />
      <el-table-column
        show-overflow-tooltip
        prop="apply_name"
        label="商品名称"
        width="85"
      />

      <el-table-column
        show-overflow-tooltip
        prop="post_name"
        label="物流公司"
        width="110"
      />
      <el-table-column
        show-overflow-tooltip
        prop="post_code"
        label="物流单号"
        width="160"
      />
      <el-table-column
        show-overflow-tooltip
        prop="post_fee"
        label="预计物流费"
        width="100"
      />
      <el-table-column
        show-overflow-tooltip
        prop="status"
        label="状态"
        width="80"
      >
        <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="sendtime"
        label="发货时间"
        min-width="170"
      />
      <el-table-column
        show-overflow-tooltip
        prop="send_num"
        label="	发货数量"
        width="80"
      />
      <el-table-column
        show-overflow-tooltip
        prop="check_num"
        label="验收数量"
        width="80"
      />
      <el-table-column
        show-overflow-tooltip
        prop="addr_info"
        label="省市区"
        min-width="170"
      />
      <el-table-column
        show-overflow-tooltip
        prop="addr"
        label="收货地址"
        min-width="170"
      />
      <el-table-column
        show-overflow-tooltip
        prop="contact"
        label="联系人"
        width="80"
      />
      <el-table-column
        show-overflow-tooltip
        prop="mobile"
        label="联系电话"
        width="110"
      />
      <el-table-column
        show-overflow-tooltip
        prop="wsm_supplier"
        label="供应商"
        min-width="220"
      />
      <el-table-column
        show-overflow-tooltip
        prop="wsm_supplierNo"
        label="仓库供应商"
        min-width="170"
      />

      <!-- v-if="status === '0' && powers.some((item) => item == '005')" -->
      <el-table-column fixed="right" width="80">
        <template slot="header" slot-scope="scope">
          <span>操作</span>
        </template>

        <template slot-scope="scope">
          <el-tooltip
            effect="dark"
            content="查看"
            v-if="!scope.row.edit"
            placement="top"
          >
            <i
              class="el-icon-view tb-icon"
              @click="openHouseModal(scope.$index)"
            ></i>
          </el-tooltip>
          <!-- v-if="sitem.status == '5'" -->
          <el-tooltip
            class="fr"
            effect="dark"
            content="新建售后申请"
            placement="top"
          >
            <i
              class="el-icon-plus tb-icon"
              @click="openModal('add', scope.row)"
            ></i>
          </el-tooltip>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
   <script>
import mixinPage from "@/mixins/elPaginationHandle";
import resToken from "@/mixins/resToken";
import asyncRequest from "@/apis/service/sellOut/salesOrder/detail";

import { mapGetters } from "vuex";

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

    powers() {
      let tran =
        this.$store.getters.btnList.find(
          (item) => item.menu_route == "workDdiffTable"
        ) || {};
      if (tran && tran.action && tran.action.length > 0) {
        return tran.action;
      } else {
        return [];
      }
    },
  },

  data() {
    return {
      orderCode: "",
      outCode: "",
      // 状态
      statusOptions: [
        { id: "1", label: "已出库" },
        { id: "2", label: "验收中" },
        { id: "3", label: "验收完成" },
      ],
      showGoodsModel: false,
      stock_code: "",
      tableData: [],
      loading: false,
      queryId: "",
      status: "",
      showModel: null,
      modelId: "",
      modelItem: null,
      s_sitem: null,
    };
  },
  mounted() {
    this.initForm();
  },
  methods: {
    refresh() {
      this.$emit("refresh");
    },
    async initForm() {
      this.status = "";
      this.queryId = this.$route.query.id;
       const { bum } = this.sitem;
        this.tableData = bum;
    },
    editRow(index) {
      let findex = this.stockForm.good_stock.findIndex((v) => v.edit === true);
      if (findex !== -1) {
        this.$message.warning("当前已有发货仓库信息在编辑，请保存后再试！");
        return;
      } else {
        this.stockForm.good_stock[index].edit = true;
      }
    },
    checkStockRow(index) {
      let total = parseInt(this.stockForm.good_stock[index].usable_stock),
        num = parseInt(this.stockForm.good_stock[index].num);
      if (total === 0) {
        this.$message.warning("该仓库已无该商品库存！不能销售！");
        return;
      } else {
        if (num > total) {
          this.$message.warning("销售数量不能大于可用库存！");
          return;
        } else {
          this.stockForm.good_stock[index].edit = false;
        }
      }
    },

    openHouseModal() {
      this.modelId = "add";
      this.modelItem = this.sitem;
      this.modelShowModel = true;
    },

    //省市区保存某一行
    checkRow(rowIndex) {
      this.$refs.addrForm.validate((valid) => {
        if (valid) {
          this.tableData[rowIndex].edit = false;
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    // 省市区删除行操作
    deleteRow(index, rows) {
      rows.splice(index, 1);
    },
    async submitForm() {
      await this.$refs.ruleForm.validate(async (valid) => {
        if (valid) {
          this.loading = true;
          const { order_addr } = JSON.parse(JSON.stringify(this.addrForm));
          let model = {
            id: this.queryId,
            order_addr: [],
          };
          order_addr.forEach((v2) => {
            let model2 = {
              post_fee: v2.post_fee,
              id: v2.id,
            };
            model.order_addr.push(model2);
          });
          let res = await asyncRequest.salefee(model);
          this.loading = false;
          if (res && res.code === 0) {
            this.$notify.success({
              title: "反馈物流费用成功！",
              message: "",
            });
            this.showModelThis = false;
            // 刷新
            this.$emit("refresh");
          } else if (res && res.code >= 100 && res.code <= 104) {
            await this.logout();
          } else {
            this.$message.warning(res.message);
          }
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    openModal(code, sitem, outcode) {
      console.log(sitem);
      this.s_sitem = sitem;
      this.modelId = code;
      this.showModel = true;
    },
  },
};
</script>
   <style lang="scss" scoped>
</style>